1、属性选择器
<body>
<p title="abc">床前明月光</p>
<p title="abcde">疑是地上霜</p>
<p title="hhhhh">举头望明月</p>
<p>低头思故乡</p>
</body>
语法：[属性名]选则含有指定属性的元素
[属性名=属性值]选则含有指定属性和属性值的元素
[属性名^=属性值]选择属性值以指定值开头的元素
[属性名$=属性值]选择属性值以指定值结尾的元素
[属性名*=属性值]属性值中含有某值的元素
将带有title属性值的元素设为橙色
p[title]{
color:orange;
}
2、伪类选择器
<body>
<ul>
<span>我是第一个</span>
<li>第一个</li>
<li>第二个</li>
<li>第三个</li>
<li>第四个</li>
<li>第五个</li>
</ul>
</body>
伪类（不存在的类，特殊的类）
伪类用来描述一个元素的特殊状态
如：第一个子元素、被点击的元素、鼠标移入的元素
伪类一般情况下使用：开头
：first-child（第一个子元素）
: last-child（最后一个子元素）
：nth-child() （选中第n个子元素）
特殊值：
n 第n个 n的范围0到正无穷
2n或even 表示选中偶数位的元素
2n+1或odd 表示选中奇数位的元素
以上这些伪类都是根据所有的子元素进行排序的
【注】
: first-of-type
：last-of-type
：nth-of-type()
这几个伪类的功能和上述类似，不同点是他们实在同类型元素中进行排序
：not() 否定伪类
将符合条件的元素从选择器中剔除
将ul里的第一个li设置为红色
ul>li :first-of-type{
color:red;
}
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
