Des formulaires attrayants avec HTML5 et CSS3
Avec un peu d’HTML5 et de CSS3, on fait des miracles !
Voici donc un exemple de code :
Un exemple de code de formulaire en HTML :
Create an Account
Create an Account
Et en y appliquant ce code CSS3 :
html, body, h1, form, fieldset, input
{
margin: 0; padding: 0; border: none;
}
body {
font-family: Helvetica, Arial, sans-serif; font-size: 12px;
}
#registration {
color: #fff;
background: #2d2d2d;
background: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, rgb(60,60,60)),
color-stop(0.74, rgb(43,43,43)),
color-stop(1, rgb(60,60,60))
);
background: -moz-linear-gradient(
center bottom,
rgb(60,60,60) 0%,
rgb(43,43,43) 74%,
rgb(60,60,60) 100%
);
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
margin: 10px;
width: 430px;
}
#registration a {
color: #8c910b;
text-shadow: 0px -1px 0px #000;
}
#registration fieldset {
padding: 20px;
}
On obtient cela :
Cela commence à devenir intéressant, je ne vous en dit pas plus et pour obtenir celui-ci :
Voir la démo : legendthemes.com/demos
Au passage, pour faire des dégradés, ce site est très utile : gradients.glrzad.com
nice :) merci je cherchais un bon tuto de personnalisation des formulaires :D