「这是我参与11月更文挑战的第十五天,活动详情查看:2021最后一次更文挑战」。
往期链接:
「CSS之选择器」
前言
今天,还是和上一章一样,继续我们的选择器分类,着实有点多啊!手都要敲麻,不过说,虽然表格一点一点敲出来,手麻了,眼花了,但我觉得我对打大掘金的表格写法,更精进了呢。
分类
伪元素
选择器 | 说明 |
---|---|
::before | 在节点前插入的内容 |
::after | 在节点后插入的内容 |
结构选择器
结构选择还是用的比较多的,尤其last-child和last-child这两个,不知道你是不是呢?
|ू・ω・)
选择器 | 说明 |
---|---|
:root | 文档的根节点 |
:empty | 无子节点的节点 |
:first-line | 元素的首行 |
:first-child | 元素中为首的节点 |
:last-child | 元素中为尾的节点 |
:only-child | 父元素仅有该元素的节点 |
:first-letter | 节点的首字母 |
:nth-child(n) | 元素中指定顺序索引的节点 |
:first-of-type | 标签中为首的标签 |
:last-of-type | 标签中为尾标签 |
:only-of-type | 父元素仅有该标签的标签 |
:nth-of-type(n) | 标签中指定顺序索引的标签 |
:nth-last-child(n) | 元素中指定逆序索引的节点 |
:nth-last-of-type(n) | 标签中指定逆序索引的标签 |
属性选择器
| 选择器 | 说明 | | | --- | --- | | [attr] | 指定属性的节点 | | [attr=val] | 属性等于指定值的节点 | | [attr|=val] | 属性以指定值(完整单词)开头的节点(不推荐使用) | | [attr*=val] | 属性包含指定值的节点 | | [attr^=val] | 属性以指定值开头的节点 | | [attr$=val] | 属性以指定值结尾的节点 | | [attr~=val] | 属性包含指定值(完整单词)的节点(不推荐使用) |
好,终于算是把选择器的分类给敲完了,真是累死了,瘫了,瘫了,希望我的文章能稍微对你起到作用,哪怕是一丢丢的作用,我的努力也没有白费,所以,大家一定要好好看哦,千万不要偷懒,扫一眼就完事了,答应我,看完。
今天就到这里了,拜了个拜,今天努力的你依然是最棒的。加油,加油,你最棒!加油,加油,你最强!哦豁,Bye Bye!!!