通用选择器
适用于文档中的所有元素
例如:
*{}
应用于页面中的所有元素
类型选择器
匹配元素名称与选择器相似的元素
例如:
h1,h2,h3{}
应用于元素,元素和元素
类选择器
匹配其类属性与此选择器的点(或句点)表示法后面的部分具有相同值的元素
例如:
.note{}
应用于所有class特性值为note的元素。
p.note{}
只应用于class特性值为note的元素
id选择器
匹配 id 属性与该选择器后面的部分具有相同值的元素 #
例如:
#introduction{}
应用于id特性值为introduction的元素。
子元素选择器
匹配指定元素的直接元素
例如:
li>a{}
应用于所有父元素为的元素(对页面中其它元素不起作用)
后代选择器
匹配指定元素的后代元素(不仅是指定元素的直接子元素)
例如:
p a{}
应用于所有位于
相邻兄弟选择器
匹配元素的相邻同级元素
例如:
h1+p{}
应用于元素之后的第一个
元素(对其他
元素不起作用)
公共兄弟选择器
匹配元素的同级元素,无论该元素是否与其同级元素相连
例如:
h1~p{}
如果有两个元素均为
元素的兄弟元素,那么这些规则对两个兄弟元素都起作用
CSS 中的伪类
锚点伪类(未访问状态、已访问状态、鼠标悬停状态、活动状态)
:link 为未访问的链接添加样式
:为访问过的链接添加样式
:hover 为鼠标悬停时的元素添加样式
:给激活的元素添加样式
:focus 为具有鼠标输入焦点的元素添加样式
:first-child 向第一个子元素添加样式
例如:
ta charset="UTF-8">
a:link{background-color: aqua;}
ZzkTxdy
CSS 选择器