Dans ce cours en ligne, je vous propose d'apprendre à rendre facilement moderne des champs input de formulaire dans le but de les rendre agréables pour vos utilisateurs.
Pour ce faire, nous allons utiliser une partie de nos connaissances en langage CSS afin de permettre la manipulation des simples champs input de formulaire HTML.
Nous irons plus loin puisque nous chercherons à modifier la mise en forme du label lorsque son champ input aura le focus !
Je mets les codes de ce tuto à votre disposition.
Pour aller plus loin dans les connaissances utilisées dans ce tutoriel, je vous propose un tuto dédié aux combinateurs CSS.
Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions sur ce cours.
Un QCM vous permettra de valider vos compétences.
Table des matières de cette formation CSS (durée : 26m47s)
-
- Mise en place du code HTML 00:03:58
- Mise en forme du champ de formulaire 00:13:18
- Manipuler le focus d'un champ de formulaire 00:09:31
- Fichiers sourcestélécharger
- QCMaccéder
- Certificat
Formateur : Carl Brison
-
Merci Carl pour ce nouveau tuto. Je rejoins le commentaire précédent. On va de découverte en découverte avec vous. Super tuto très bien expliqué avec de nouvelles astuces CSS. Validé 100 % champ de formulaire.
-
Décidément inépuisable, ce css!
-
Ce fut également un plaisir de suivre ce petit tuto qui m'a rappelé qu'on pouvait donner une dimension au label avec les padding (sans width) et m'a fait découvrir le focus-within qui donne un effet sympa au label en focus. On va de découverte en découverte avec vous :)
-
Avec quelle version de logiciel ce tuto est-il compatible ?HTML 5
-
Quel est le niveau requis pour suivre ce tuto ?débutant
note moyenne
avis laissés