CSS - base - 4/4 Pseudo-classes
Source :
CSS - 4/4 - Exercice 2 (en ligne)
En utilisant les sélecteurs réaliser les mises en forme suivantes :
- Les textes du formulaire sont en Helvetica, la largeur globale du formulaire est de 400px, il doit être centré dans la page et écarté du bord supérieur de la page de 100px.
-
Des input avec une bordure noire continue de 1 pixel, des bords arrondis, une largeur fixée à 200px et faire en sorte que les champs soient espacés les uns des autres. Attention à ne pas commencer la frappe dans l'arrondi du champ.
-
Des label de 100px de large à gauche des champs de saisie.
-
Le bouton d'envoi doit avoir une couleur de fond modifiée, faire 400px de large et l'écriture doit être en gras au centre du bouton.
-
L'input ayant le focus doit avoir un bord de 2px bleu.
<form action="" method="post">
<label for="nom">Nom</label>
<input type="text" name="nom" id="nom" required>
<label for="prenom">Prénom</label>
<input type="text" name="prenom" id="prenom" required>
<fieldset>
<legend>Adresse</legend>
<label for="rue">rue</label>
<input type="text" name="rue" id="rue">
<label for="num">Numéro</label>
<input type="number" name="num" id="num">
<label for="cp">Code Postal</label>
<input type="number" name="cp" id="cp">
<label for="loc">Localité</label>
<input type="text" name="loc" id="loc">
</fieldset>
<input type="submit" value="Envoyer">
</form>