HTML + CSSChamps

Libellé qui monte dans le coin

Le libellé se trouve dans le champ et remonte dans le coin supérieur dès que vous commencez à écrire.

Réglages

16px
1x

Code

<label class="uv-in2f"><input placeholder=" "><span>E-mail</span></label>

Prompt pour l’IA

Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.

Plus dans Champs

Où l’utiliser

Les labels flottants font gagner de la place dans les formulaires où chaque pixel compte : le champ e-mail d’une connexion, l’étape adresse d’un paiement sur mobile ou un court formulaire de contact. Le libellé ne disparaît jamais, il se pousse simplement. Un champ à label flottant en HTML et CSS, avec un halo de focus discret.

Gardez des libellés courts, un ou deux mots, car ils rétrécissent en remontant. Pour les consignes longues, comme les règles d’un mot de passe, ajoutez plutôt une ligne d’aide sous le champ.