DB
程序员文章站
2022-03-28 16:37:59
...
理想很丰满,现实很骨感。为了丰满起来,再接再厉吧兄弟! 这里我只说一些在某些教科书上很少或根本不曾提及的选择器的用法。 1.类选择器 比如说: .class1{font:3cm}.class2{color:red} 如果样式表里出现这样的选择器呢? .class1.class2{background:yellow
理想很丰满,现实很骨感。为了丰满起来,再接再厉吧兄弟!
这里我只说一些在某些教科书上很少或根本不曾提及的选择器的用法。
1.类选择器
比如说:
.class1{font:3cm} .class2{color:red}
如果样式表里出现这样的选择器呢?
.class1.class2{background:yellow}
2.根据元素属性来选择元素
还是用例子来说明问题:
a[alt]{border:3px solid red;}
比如说:
扩展:
*[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元素。