目录
属性选择器
1.[属性名]{}
2. [属性名=属性值]{}
3.[属性名^=属性值]{}
4. [属性名$=属性值]{}
5.[属性名*=属性值]{} 1.[属性名]{}
2. [属性名=属性值]{}
3.[属性名^=属性值]{}
4. [属性名$=属性值]{}
5.[属性名*=属性值]{}
解释：
1.选择含有指定属性的元素
2.选择含有指定属性以及指定属性值的元素
3.选择含有指定属性以及指定属性值结尾的元素
4.选择含有指定属性,只要含有某个属性值的元素
<style>
[title]{
color: red;
}
[title=ab]{
color: green;
}
[title^=ab]{
background-color: pink;
}
[title$=ab]{
font-size: 30px;
}
[title*=c]{
background-color: green;
}
</style>
body>
<!-- title属性 当鼠标悬浮到对应的区域后，
会显示对应title属性的属性值 -->
<h1 title="a" id="hh">满江红·写怀</h1>
<h3 title="ab">岳飞·宋</h3>
<p>····</p>
<p title="abc"></p>
<p title="abab"></p>
<p title="c">。</p>
<p></p>
</body>
title属性 当鼠标悬浮到对应的区域后，
会显示对应title属性的属性值伪类选择器
:first-child 第一个子元素
:last-child 最后一个子元素
:nth-child(n) 选中第n个子元素
n 选中所有的子元素
2n/even 偶数
2n+1/odd 奇数 :first-child 第一个子元素
:last-child 最后一个子元素
:nth-child(n) 选中第n个子元素
n 选中所有的子元素
2n/even 偶数
2n+1/odd 奇数
:first-of-type 第一个子元素
:last-of-type 最后一个子元素
:nth-of-type(n) 选中第n个子元素:not() 否定伪类 将符合条件的元素去除
元素的伪类
link 表示未访问过的a标签的状态
visited 表示访问过的a标签的状态
hover 鼠标移入后，元素的状态
active 鼠标点击后，元素的状态 :first-of-type 第一个子元素
:last-of-type 最后一个子元素
:nth-of-type(n) 选中第n个子元素
link 表示未访问过的a标签的状态
visited 表示访问过的a标签的状态
hover 鼠标移入后，元素的状态
active 鼠标点击后，元素的状态伪元素选择器
::first-letter 第一个字母
::first-line 第一行
::selection 选中的内容
::before 在元素开始的位置前
::after 在元素结束的位置后
- 设置鼠标悬停在元素上时的样式
- 为已访问和未访问链接设置不同的样式
- 设置元素获得焦点时的样式