Types de sélecteurs d'attributs CSS - Semalt Expert
Un élément HTML consiste en une classe, un ID et des attributs. Un sélecteur d'attribut sélectionne les éléments HTML qui comportent un attribut ou une valeur d'attribut. Les sélecteurs d'attributs fournissent une méthode simple d'application de styles sur des éléments HTML avec un attribut particulier ou une valeur de trait. Les sélecteurs d'attribut sont définis par deux crochets, qui entourent l'attribut avec sa valeur. Pourtant, vous pouvez mettre un sélecteur de type d'élément avant. Le sélecteur CSS [attribut] applique les règles de style à un élément si et quand il consiste en un trait donné.
Types de sélecteurs d'attributs
Il existe différents types de sélecteurs d'attributs dont chacun peut être utilisé pour des cas distincts:
CSS [attribut | = "valeur"] éléments qui ont un trait particulier, et il commence avec une valeur définie.
CSS [attribut ~ = "valeur"] Le sélecteur est utilisé pour trouver des éléments avec une valeur de propriété comportant un mot spécifique.
CSS [attribut ^ = "valeur"] Le sélecteur recherche des éléments avec une valeur de propriété suppliant d'une valeur spécifique. La valeur n'est pas nécessairement un mot entier.
CSS [attribut $ = "valeur"] Le sélecteur recherche les composants dont la valeur d'attribut se termine par une valeur définie.
Applications des sélecteurs d'attribut CSS
Le sélecteur d'attribut peut être utilisé de différentes manières au lieu d'utiliser le sélecteur universel, classe ou ID
L'utilisation la plus courante des sélecteurs d'attribut se fait sur les entrées. comprennent les sélecteurs de texte, les sélecteurs de cases à cocher, les sélecteurs de mots de passe, les sélecteurs de fichiers, les sélecteurs cachés, les sélecteurs de mot de passe, les sélecteurs de radio, les sélecteurs de réinitialisation et autres.
Liens de style
Par exemple, les sélecteurs d'attribut peuvent être utilisés pour créer un blogroll où vous avez une liste de liens vers des sites amis. La manière traditionnelle d'y arriver est d'assigner un nom d'appel qui nécessiterait plus de balises, mais vous pouvez utiliser le nth-child qui exige que les commandes ne changent jamais. il y a un attribut que vous pouvez cibler.
Entrées de bordure
Le fait de styliser des éléments de bordure en utilisant l'attribut CSS border image est une manière élégante d'ajouter des images au corps. Cela vous permet de définir une image en tant que bordure d'un élément. L'image de bordure peut être mise à l'échelle, découpée en tranches, répétée de différentes manières pour s'assurer qu'elle s'adapte à la zone frontalière. L'attribut radius radius permet d'ajouter des coins arrondis sans utiliser d'images. La propriété définit la forme du coin.
Styling colors
Les sélecteurs d'attributs CSS simplifient le style de tous les éléments ayant une valeur de couleur particulière. Vous pouvez utiliser le mot-clé color, les notations RGB, RGBA, HSL et HSLA. Les valeurs de couleur RGBA sont une extension du modèle de couleur RVB avec un canal qui définit l'opacité d'une couleur. La valeur des paramètres va de 1.0 (opaque) à 0.0 (transparent).
Le modèle de couleur HSL est expliqué par (Hue_saturation_Lightness) .La représentation de la teinte est sous la forme de l'angle (0-360) ou de la couleur La saturation et la luminosité sont mesurées en pourcentages 0% de saturation représente la nuance ou le gris tandis que 100 représente la couleur, 100% de légèreté représente le blanc tandis que 0% est le noir.
Post a comment