manuel de référence CSS

règle CSS @ (RULES)

大全 des attributs CSS

Fonctions CSS Manuel complet des sélecteurs CSS

Sélecteur [attribute~=value] CSS

Représente les éléments qui ont une propriété nommée attribute et qui est une liste de valeurs séparées par des espaces, au moins une des valeurs correspondant à "value".

Manuel complet des sélecteurs CSS

Exemple en ligne

Sélectionner tous les éléments avec l'attribut title contenant le mot "flower"

Exemple

!DOCTYPE html
<html>
<head>
<meta charset="utf-8">　
<title>Tutoriel de base (oldtoolbag.com)</title>　
<style>
[title~=flower]
{
　　　　bordure:5px solide rouge;
}
</style>
</head>
<body>
<p>Si le mot "flower" est contenu dans l'attribut "title" de l'image, il sera mis en bordure rouge.</p>
<img src="klematis.jpg" title="klematis flower" width="150" height="113"　/>
<img src="img_flwr.gif" title="flowers" width="224" height="162"　/>
<img src="landscape.jpg" title="landscape" width="160" height="120"　/>
<p><b>Attention:</b>Si [<i>attribute</i>~=<i>value</i>] Pour IE8　et les versions antérieures, DOCTYPE est obligatoire.</p>
</body>
</html>

Voyons le tester ‹/›

Définition et utilisation

[attribute~=value] Sélecteur est utilisé pour sélectionner les éléments dont la valeur de l'attribut contient un mot spécifié.

Compatibilité du navigateur

IEFirefoxOperaChromeSafari

Tous les navigateurs populaires prennent en charge [attribute~=value] sélecteur.

Attention:[attribute~=value] dans IE8En running, il doit être déclaré <!DOCTYPE>.

Articles associés

Tutoriel CSS: Sélecteur d'attribut CSS

Manuel complet des sélecteurs CSS

Fonctions CSS Manuel complet des sélecteurs CSS