Hogyan lehet CSS-szel stilizálni a beviteli és elküldési gombot?
CSS-t tanulok. Hogyan lehet a beviteli és elküldési gombot CSS-szel stílusosítani?
I'm próbál létrehozni valami ilyesmit, de fogalmam sincs, hogyan kell csinálni.
<form action="#" method="post">
Name <input type="text" placeholder="First name"/>
<input type="text" placeholder="Last name"/>
Email <input type="text"/>
Message <input type="textarea"/>
<input type="submit" value="Send"/>
</form>
Egyszerűen stilizálja a Submit gombot, mint bármely más html elemet.A CSS attribútumválasztó segítségével különböző típusú beviteli elemeket is megcélozhat.
Példaként írhatod, hogy
input[type=text] {
/*your styles here.....*/
}
input[type=submit] {
/*your styles here.....*/
}
textarea{
/*your styles here.....*/
}Kombinálni más szelektorokkal
input[type=text]:hover {
/*your styles here.....*/
}
input[type=submit] > p {
/*your styles here.....*/
}
....Itt egy működő Példa
az űrlapelemek felhasználói felületét némileg a böngésző és az operációs rendszer szabályozza, ezért nem triviális ezeket megbízhatóan úgy alakítani, hogy minden gyakori böngésző/OS kombinációban ugyanúgy nézzenek ki.
Ehelyett, ha valami különlegeset akarsz, azt javasolnám, hogy használj egy olyan könyvtárat, amely stilizálható űrlapelemeket biztosít. Az uniform.js egy ilyen könyvtár.
