本文详细介绍了CSS选择器的各种用法，包括基本选择器、复合选择器以及伪元素选择器。通过实例解析了如何使用通配符*、元素类型选择器、类选择器、ID选择器和属性选择器。此外，还探讨了并集选择器、后代选择器、子元素选择器和兄弟元素选择器的组合使用，以及伪元素如:first-line和:first-letter的特殊应用。这是一篇帮助开发者提升CSS技能的重要教程。
这本书CSS选择器居然有两章，让我意识到自己知道的选择器是有点少了。
使用CSS基本选择器
- 通配选择所有的元素包含html和body元素 星号（*）
- 元素类型选择器或者说是标签选择器 例如：a div span p h1等
- 类选择器 即class属性匹配的值 例如：.box1
- ID 选择器 id属性匹配的值例如：#box1
- 属性选择器
复合选择器
- 并集选择器：
<选择器>,<选择器>使用逗号将各个选择器分开 - 后代选择器：
<第一个选择器> <第二个选择器>从第一个选择器的后代元素中找到第二个匹配的元素，并不一定是直接子元素哦 - 选择子元素：
<第一个选择器> > <第二个选择器>就是只选择第一个选择器当中的直接子元素 - 选择兄弟元素：
<第一个选择器>+<第二个选择器>选择紧跟第一个选择器元素之后的元素
使用伪元素选择器
- ::first-line:匹配文本行的首行，若想选择p元素的首行，那么就是：p::first-line
- ::first-letter:匹配文本块的首字母
- :before和:after,可以用此属性来添加内容
- 使用:before ,:after属性来与css计数器搭配使用。
扫一扫
3723
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
