28173 sujets
CSS et mise en forme, CSS3
Déjà, il faut savoir que le rendu des éléments de formulaire dépend beaucoup du système d'exploitation et/ou du navigateur. Le maîtrise que l'on peut avoir sur le rendu de ces éléments est parfois faible. C'est un inconvénient pour un graphiste qui veut que tout soit comme il le voudrait, mais c'est aussi une chance pour l'utilisateur, qui a ainsi des repères solides. Niveau ergonomie, c'est plutôt une bonne chose, donc.
Pour les checkbox, j'avoue ne pas trop savoir ce qu'il est possible de faire ou pas.
Pour supprimer le cadre, tu peux peut-être supprimer le border. Vu que ces éléments auront par défaut une bordure, il faut dire qu'on ne souhaite pas en avoir :
Mais je ne suis pas sûr de l'efficacité de la démarche.
Reste maintenant la question du sélecteur. input désigne l'ensemble des champs de saisie. Il faut donc viser plus spécifiquement les input de type checkbox. On peut utiliser le sélecteur CSS suivant :
Ce qui fonctionnera avec la plupart des navigateurs… sauf Internet Explorer, en retard sur ce genre de choses. On voudra alors peut-être passer par une classe spécifique.
Mais là encore, pas sûr du rendu final suivant les navigateurs/Systèmes d'exploitation.
Pour les checkbox, j'avoue ne pas trop savoir ce qu'il est possible de faire ou pas.
Pour supprimer le cadre, tu peux peut-être supprimer le border. Vu que ces éléments auront par défaut une bordure, il faut dire qu'on ne souhaite pas en avoir :
border: none;
Mais je ne suis pas sûr de l'efficacité de la démarche.
Reste maintenant la question du sélecteur. input désigne l'ensemble des champs de saisie. Il faut donc viser plus spécifiquement les input de type checkbox. On peut utiliser le sélecteur CSS suivant :
input[type=checkbox] { border: none; }
Ce qui fonctionnera avec la plupart des navigateurs… sauf Internet Explorer, en retard sur ce genre de choses. On voudra alors peut-être passer par une classe spécifique.
HTML :
<input type="checkbox" class="checkbox" value="machin" />
CSS :
input.checkbox { border: none; }
Mais là encore, pas sûr du rendu final suivant les navigateurs/Systèmes d'exploitation.