DB

WBOY
Libérer: 2016-06-07 15:38:57
original
1297 Les gens l'ont consulté

理想很丰满,现实很骨感。为了丰满起来,再接再厉吧兄弟! 这里我只说一些在某些教科书上很少或根本不曾提及的选择器的用法。 1.类选择器 比如说: .class1{font:3cm}.class2{color:red} 如果样式表里出现这样的选择器呢? .class1.class2{background:yellow

理想很丰满,现实很骨感。为了丰满起来,再接再厉吧兄弟!



这里我只说一些在某些教科书上很少或根本不曾提及的选择器的用法。


1.类选择器


比如说:

.class1{font:3cm}
.class2{color:red}
Copier après la connexion


如果样式表里出现这样的选择器呢?

.class1.class2{background:yellow}
Copier après la connexion


2.根据元素属性来选择元素

还是用例子来说明问题:

a[alt]{border:3px solid red;}
Copier après la connexion

比如说:

 CSDN

扩展:

*[title]{font-weight:bold;}表示选择所有具有"title“属性的元素。

a[href="http://www.csdn.net"]{font-weight:bold;}

img[title~="Figure"]{border:1px solid gray;}

[title^="bar"] 选择title属性以"bar“开头的所有元素。

[title$="bar]  选择title属性以"bar"结尾的所有元素。

[title*="bar"]  选择title属性中包含子字符串"bar”的所有元素。

此外还有:

父子选择器:h1>strong{};表示只选择作为h1子元素的strong元素。

兄弟选择器:h1+strong{};表示选择紧邻着h1的兄弟strong元素。


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal