css3选择器分类
CSS3选择器分类如下图所示
选择器的语法
1.基本选择器
| 类型 | 代码 | 功能描述 |
| 通配选择器 | *{ margin: 0; padding: 0; border: none; } | 选择文档中所有html元素 |
| 元素选择器 | body { background: #eee; } | 选择指定类型的HTML元素 |
| 类选择器 | .list { list-style: square; } | 选择指定class属性值为“class”的 任意类型的任意多个元素 |
| ID选择器 | #list { width: 500px; margin: 0 auto; } | 选择指定ID属性值为“id”的任意类型元素 |
| 后代选择器 | .list li { margin: 10px; background: #fff; } | 选择作为某元素后代的元素。 |
基本选择器扩展
| 类型 | 代码 | 功能描述 |
| 子元素选择器 | #wrap > .inner. {color: pink;} | 也可称为直接后代选择器， 此类选择器只能匹配到直接后代， 不能匹配到深层次的后代元素 |
| 相邻兄弟选择器 | #wrap #first+.inner{color:#f00; } | 它只会匹配紧跟着的兄弟元素 |
| 通用兄弟选择器 | #wrap #first ~ div { border: 1px solid;} | 它会匹配所有的兄弟元素(不需要紧跟) |
| 选择器分组 | h1,h2,h3{color: pink;} | 此处的逗号我们称之为结合符 |
2.属性选择器
（1）存在和值属性选择器
| 选择器 | 功能描述 |
| [attribute=value] | 用于选取带有指定属性和值的元素。 |
| [attribute~=value] | 用于选取属性值中包含指定词汇的元素。 |
| [attribute] | 用于选取带有指定属性的元素。 |
（2）子串值属性选择器
| 选择器 | 功能描述 |
| [attr|=val] | 用于选取带有以指定值开头的属性值的元素。 |
| [attribute^=value] | 匹配属性值以指定值开头的每个元素。 |
| [attribute$=value] | 匹配属性值以指定值结尾的每个元素。 |
| [attribute*=value] | 匹配属性值中包含指定值的每个元素。 |
CSS3 target 选择器_:target伪类的使用
arget作为目标伪类选择器，是css3中的新特性之一。URL 带有后面跟有锚名称 #，指向文档内某个具体的元素。这个被链接的元素就是目标元素(target element)。:target 选择器可用于选取当前活动的目标元素。
css兄弟选择器(+ 和 ~)的使用和区别
这篇文章主要讲解css中兄弟选择器的使用，以及+和~的区别有哪些？+ 选择器：如果需要选择紧接在另一个元素后的元素，而且二者有相同的父元素，可以使用相邻兄弟选择器。 ~ 选择器：作用是查找某一个指定元素的后面的所有兄弟结点。
jquery的选择器有哪些？如何对元素取值和设置值
jQuery 选择器 jQuery 选择器允许您对 HTML 元素组或单个元素进行操作， Jquery 选择器包括：基本选择器、层叠选择器 、基本过滤选择器 、内容过滤选择器、可视化过滤选择器.....
CSS中的focus-within伪类选择器
在CSS中 :focus-within 是一个伪类，CSS中伪类:focus-within能非常方便处理获取焦点状态， 当元素本身或其后代获得焦点时，:focus-within伪类的元素就会有效。
vue 选择器_实现scoped深度作用选择器
vue项目中，当<style>标签有scoped属性时，它的 CSS 样式只作用于当前组件中的元素，父组件的样式将不会渗透到子组件中。如果你希望 scoped 样式中的一个选择器能够作用得更深，例如影响子组件
css 选择器符号
空格：后代选择器，表示div元素里面所有的p元素。> 子选择器：表示div元素里面所有的子代（不含孙代及以后）p元素，~兄弟元素选择器：表示.cls元素往后的同级的p元素
css选择器总结_30个CSS3选择器
总结30个CSS3选择器：*选择器是选择页面上的全部元素，上面的代码作用是把全部元素的margin和padding设为0，最基本的清除浏览器默认样式的方法。
css节点选择器
基础选择器是选择器的所有选择器的基本组成元素，也最简单，包含如下5个类别：ID选择器，标签选择器，类选择器，属性选择器，通配选择器
CSS3 中关于 *-of-type 和 *-child的差异性及适用场景
CSS3 中有很多表示元素序号的选择器，有以下几种:first-child、:first-of-type、:last-of-type、:only-of-type、:only-child、:nth-child(n)、:nth-last-child(n)、:nth-of-type(n)、:nth-last-of-type(n)、:last-child
微信小程序文档没写支持, 但是实际支持的选择器有哪些?
目前支持的选择器有,在实践中我发现, 除了文档上说的几种选择器, 经过测试发现其实还有几种支持的选择器没有列举!还支持哪些选择器?
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!