28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous !

Cela fait maintenant un moment qu'une question me taraude. Je vois de plus en plus souvent des sites avec des formulaire proposant un effet curieux.
Il y a d'abord un hover sur les divers champs du formulaire, de telle sorte que lorsqu'on les survole, le contour ou encore le fond changent de couleur. Bon là, rien de très sorcier.

Mais en plus de cela, lorsqu'on donne le focus à un champ (en cliquant dedans ou bien en "tabbant"), le même effet CSS s'applique et continue à s'appliquer tant que l'on a pas quitté le champ.

Un exemple plus "imagé" par ici: http://www.nslan.org/forum/

J'ai déjà décortiqué le CSS pour comprendre, mais je n'ai rien trouvé d'autre que des input:hover. Si quelqu'un pouvait m'expliquer d'où vient ce bel effet... Je le trouve agréable et de plus franchement ergonomique, surtout pour se repérer dans des formulaires un peu volumineux.

D'avance merci !
Modifié par mOrbide (30 Apr 2008 - 01:37)
Bonjour,

En css quelque chose du genre:
input[type="text"]:focus{
background:#fff;
border:solid 1px #cc0000;
}


édit: ton lien ne montre aucun formulaire
Modifié par Igor (27 Apr 2008 - 13:15)
Igor a écrit :
Bonjour,

En css quelque chose du genre:
input[type="text"]:focus{
background:#fff;
border:solid 1px #cc0000;
}

Je vais tester ça de suite, merci Smiley smile

Igor a écrit :
édit: ton lien ne montre aucun formulaire

Chez moi ça affiche un formulaire de recherche... Smiley confus
mOrbide a écrit :

Chez moi ça affiche un formulaire de recherche... Smiley confus

Parce que tu es enregistré sur ce forum. Moi il me dit:

a écrit :
Désolé mais vous n’êtes pas autorisé à utiliser le système de recherche.
mOrbide a écrit :

Je vais tester ça de suite, merci Smiley smile

Il y a par contre un mais Smiley smile C'est le support de :focus par les navigateurs.
Igor a écrit :

Parce que tu es enregistré sur ce forum. Moi il me dit:

Désolé mais vous n’êtes pas autorisé à utiliser le système de recherche.

Mince, je ne savais pas que la recherche était privée par défaut sur phpBB... Désolé !
Quoi qu'il en soit, c'était tout à fait l'effet que je recherchais.

Igor a écrit :

Il y a par contre un mais Smiley smile C'est le support de :focus par les navigateurs.

Et de fait, ça ne passe évidemment pas sous IE... Mais bon, je m'y suis fait.

Merci !