css3新增选择器

深碍√TFBOYSˉ_ 2022-06-06 13:09 176阅读 0赞

1.        属性选择器：

1)        E\[att\]  元素\[属性\]：选择具有att属性的E元素，需要选择有某个属性的元素，  而不论是行为是什么，可以使用简单的属性选择器

注：可以根据多个属性进行选择，只需要将属性选择器连接即可。

2)        E\[att=val\] 元素\[属性=属性值\]: 选择具有att属性且属性值为val的E元素，进一步缩小范围

3)        E\[att~=”val”\] 元素\[属性~=”属性值”\]：选择具有att属性且属性值有很多个，其中一个属性值为val的E元素

4)        E\[att|=”val”\] 元素\[属性|=“属性值”\]：选择具有att属性并且属性值为val开头并且用连接符“-”分割字符串的E元素

5)        E\[att^=”val”\] 元素\[属性^=“属性值”\]：选择具有att属性，且属性值是以val开头的E元素

6)        E\[att$=”val”\] 元素\[属性$=“属性值”\]：选择具有att属性并且属性值是以val结尾的E元素

7)        E\[att\*=”val”\] 元素\[属性\*=“属性值”\]：选择具有att属性并且属性值包含val字符的E元素

2.        伪元素选择器（伪对象/虚拟选择器）：内容本来不是一个元素，但是我们选择器可以像选择元素一样的选择他，并且设置样式

1)        E:first-letter/E::first-letter（c3新版）：设置元素内第一个字符的样式   注：针对的一定是块级元素

2)        E:first-line/ E::first-line（c3新版）：设置元素内的第一行字符的样式

3)        E:before/E::before（c3新版）：在每个E元素的内容之前插入内容，用来和content（内容）属性一起使用。

4)        E:after/E::after（c3新版）：在每个E元素的内容之后插入内容，用来和content（内容）属性一起使用。

如果是一个就没有必要在前后插入，如果有很多的话并且需要修改则要用到

5)        E:selection：设置对象被选中时的颜色。

3.        伪类选择器：

1)        E:first-child：父元素的第一个子元素E

2)        E:last-child：父元素的最后一个子元素E

3)        E:nth-child(n)：匹配父元素的第n个子元素E

E:nth-child(odd)：匹配父元素的奇数子元素E

E:nth-child(even)：匹配父元素的偶数子元素E

4)        E:nth-last-child(n)：匹配父元素的倒数第n个子元素E

发表评论取消回复

表情：

评论列表（有 0 条评论，176人围观）

还没有评论，来说两句吧...

相关阅读

相关 CSS3新增选择器汇总

属性选择器 E\[attr\] E\[attr=val\] E\[attr^=val\] 开头 E\[attr$=val\] 结尾 E\[a

Bertha 。/ 2022年12月18日 02:58/ 0 赞/ 111 阅读

相关 CSS3新增选择器

CSS3新增选择器元素关系选择器 <table> <thead> <tr> <th>选择器名称</th> <th>示例</th>

妖狐艹你老母/ 2022年11月11日 10:51/ 0 赞/ 149 阅读

相关前端知识汇总-----CSS选择器和CSS3新增选择器

CSS选择器：基础选择器： \ 匹配所有的选择器 E 标签选择器p,head

短命女/ 2022年09月25日 09:26/ 0 赞/ 184 阅读

相关 CSS3 选择器——属性选择器

上一切在《[CSS3选择器——基本选择器][CSS3]》中主要介绍了CSS3选择器的第一部分，这节主要和大家一起来学习CSS3选择器的第二部分——属性选择器。属性选择器早在CS

淡淡的烟草味﹌/ 2022年06月10日 05:24/ 0 赞/ 391 阅读

相关 CSS3 选择器——基本选择器

[CSS的选择器][CSS]，我想大家并不会陌生吧，因为天天在使用，但对于[CSS3的选择器][CSS]，要运用的灵活到位，我想对很多朋友还是一定的难度，特别是CSS3中的:n

我就是我/ 2022年06月10日 05:24/ 0 赞/ 423 阅读

相关 css3新增选择器

1. 属性选择器： 1) E\[att\] 元素\[属性\]：选择具有att属性的E元素，需要选择有某个属性的元素，而不论是行为是什么，可以

深碍√TFBOYSˉ_/ 2022年06月06日 13:09/ 0 赞/ 177 阅读

相关 CSS3 新增选择器

结构(位置)伪类选择器 :first-child :选取属于其父元素的首个子元素的指定选择器 :last-child :选取属于其父元素的最后一个子元素的指定

柔光的暖阳◎/ 2022年05月16日 08:29/ 0 赞/ 183 阅读

相关 CSS完整参考手册及说明（包含CSS3新增选择器）

在 CSS 中，选择器是一种模式，用于选择需要添加样式的元素。 “CSS” 列指示该属性是在哪个 CSS 版本中定义的。（CSS1、CSS2 还是 CSS3。）详见[h

秒速五厘米/ 2022年05月14日 05:18/ 0 赞/ 81 阅读

相关 CSS3 选择器

在 CSS 中，选择器是一种模式，用于选择需要添加样式的元素。 "CSS" 列指示该属性是在哪个 CSS 版本中定义的。（CSS1、CSS2 还是 CSS3。） <tabl

阳光穿透心脏的1/2处/ 2022年01月30日 16:11/ 0 赞/ 306 阅读

相关 CSS3选择器

本文笔记基于「千古壹号」的GitHub项目：https://github.com/qianguyihao/web 文章目录 1.介绍 2.选择器

野性酷女/ 2021年12月10日 03:25/ 0 赞/ 370 阅读