Ik ben CSS aan het leren. Hoe stijl ik input en submit knop met CSS?
Ik'm probeer iets als dit te maken, maar ik heb geen idee hoe ik het moet doen
<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>
Stijl je Submit knop zoals je elk ander html element zou stylen. Je kunt verschillende type invoer elementen targetten met CSS attribuut selector
Als voorbeeld kun je schrijven
input[type=text] {
/*your styles here.....*/
}
input[type=submit] {
/*your styles here.....*/
}
textarea{
/*your styles here.....*/
}
Combineer met andere selectors
input[type=text]:hover {
/*your styles here.....*/
}
input[type=submit] > p {
/*your styles here.....*/
}
....
Hier is een werkend [Voorbeeld][1]
De UI van formulierelementen wordt enigszins bepaald door browser en besturingssysteem, dus het is niet triviaal om ze op een betrouwbare manier zo te stylen dat ze er in alle gangbare browser/OS-combinaties hetzelfde uitzien.
In plaats daarvan, als je iets specifieks wilt, zou ik aanraden om een bibliotheek te gebruiken die je vormbare formulier-elementen biedt. uniform.js is zo'n bibliotheek.