Définition de la CSS :in-range.
La pseudo-classe de Limite CSS :in-range permet de cibler tous les éléments (X)HTML de formulaire INPUT dont la valeur est comprise entre la valeur de son attribut min et la valeur de son attribut max, afin de lui assigner des propriétés CSS.
La pseudo-classe de Limite CSS :in-range fonctionne aussi, si l'élément n'a qu'un attribut min ou max spécifié.
:in-range ::in-range {
/* Propriétés */
}
identifiant:in-range {
/* Propriétés */
}
Conditions d'application de la CSS :in-range.
La pseudo-classe de Limite CSS :in-range s'applique sur les éléments INPUT acceptant les attributs min ou max et ayant au moins un ces attributs déclaré et dont l'attribut ou la propriété disabled ou readonly n'est pas activé.
La pseudo-classes de feuille de style :in-range CSS ne peut pas se déclarer dans l'attribut HTML ou XHTML STYLE.
La pseudo-classes CSS :in-range doit être déclarée dans une balise HTML ou XHTML STYLE.
Problème d'interprétation de :in-range en Css.
La pseudo-classe de Limite CSS :in-range peut poser des problème sur les anciens navigateurs, car elle prend en compte les éléments dont le disabled = true et readonly = true.
Règles de syntaxes CSS pour :in-range.
Attention à l'écriture de la pseudo-classe de Limite CSS :in-range
Attention, la pseudo-classe CSS ":in-range" a une écriture un peu spéciale, "in-range" est toujours précédée de ":".
Dans le cas ci-dessous, l'identifiant est collé à ":". Dans ce cas, nous demandons d'appliquer les propriétés sur les éléments HTML ou XHTML qui ont "identifiant".
.identifiant:in-range{ /* Propriétés css */ }
#identifiant:in-range{ /* Propriétés css */ }Dans le cas ci-dessous, l'identifiant est espacé de ":". Dans ce cas nous demandons d'appliquer les propriétés sur les éléments HTML ou XHTML dont le parent direct ou indirect est "identifiant"..identifiant :in-range{ /* Propriétés css */ }
#identifiant :in-range{ /* Propriétés css */ }
Vous pouvez donc si nécessaire mettre un sélecteur devant pour un ciblage plus précis, sinon les propriétés seront appliquées à l'ensemble des éléments HTML ou XHTML acceptant :in-range.
Où écrire la pseudo-classe de Limite CSS :in-range
La pseudo-classe CSS :in-range ne peut pas être déclarée dans une balise HTML ou XHTML avec l'attribut HTML ou XHTML "STYLE" ou dans une feuille de style externe.
Elle se déclare dans une balise HTML ou XHTML "STYLE" de votre page :
<STYLE>
input:in-range{}
</STYLE>Compatibilités navigateurs du sélecteur :in-range
- Détails des versions de la CSS :in-range
- Sélecteur
:in-rangecss n'est pas compatible W3C - Sélecteur
:in-rangeest compatible avec CSS4 et plus.
Votre avis sur la définition :in-range en CSS
Votez pour la définition CSS :in-range
- 1/5
- 2/5
- 3/5
- 4/5
- 5/5
Votes: 5 / 5 - 1
vote
Cliquez sur une étoile pour voter.