Fonction attr

La fonction attr permet d'obtenir en CSS la valeur d'un attribut d'une balise HTML.

Syntaxe

csssélecteur {
  propriété: attr(nom, type, valeur);
}

Paramètres

Paramètre Description
nom Le nom de l'attribut de l'élément transmis au CSS.
type Le type de valeur de la propriété CSS. Les mots-clés suivants sont autorisés : string (chaînes), color (couleur), url (adresse web), integer (nombre entier), number (nombre réel), angle (angle), time (temps), deg (degré), ainsi que les unités CSS telles que em, px, etc.
valeur La valeur qui sera utilisée dans le cas où l'attribut est absent ou si le navigateur ne peut pas l'obtenir.

Exemple

Affichons la valeur de l'attribut href d'un lien entre parenthèses après son texte :

html<a href="http://google.com">lien</a>
cssa::after {
  content: ' (' attr(href) ')';
}

Результат:

Voir aussi

  • la propriété content,
    qui permet d'ajouter du texte dans les éléments
  • le pseudo-élément before,
    qui effectue une insertion avant le texte de la balise
  • le pseudo-élément after,
    qui effectue une insertion après le texte de la balise