CSS学习笔记——复合选择器
Posted UDK_KL.
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了CSS学习笔记——复合选择器相关的知识，希望对你有一定的参考价值。
复合选择器是建立在基础选择器之上的多个基本选择器复合而成的选择器，其优点是可以更准确、高效地选择目标元素
-
复合选择器的分类
- 后代选择器
- 子选择器
- 并集选择器
- 伪类选择器
后代选择器
选择父元素里全部同名子元素
选择时可以用类名区分不同子级
最终的选择目标是最后一个子级及其子级的同名标签
父级(任意基础选择器) 子级 子子级... {样式声明}
<style>
ol li { }
</style>
<body>
<ol>
<li> </li>
<li> </li>
<li> </li>
</ol>
<ul>
<li> </li>
<li> </li>
<li> </li>
</ul>
</body>
子选择器
该选择器只能选择父级最近一层的子级
使用方式同后代选择器
并集选择器
最终的选择目标是所有在选择器里出现的同名的标签
习惯上并集选择器竖着写
父级,
子级 {样式}
<style>
div,
a { }
</style>
伪类选择器
:focus{}
用于选取获得焦点的表单元素，焦点就是光标（鼠标指针），一般< input>表单元素才能获取，因此这个选择器也主要针对表单元素来说
input:focus{
background-color:yellow;
}
以上是关于CSS学习笔记——复合选择器的主要内容，如果未能解决你的问题，请参考以下文章