各位老铁们，大家好，今天由我来为大家分享css3伪类选择器，以及jquery的表单选择器的相关问题知识，希望对大家有所帮助。如果可以帮助到大家，还望关注收藏下本站，您的支持是我们最大的动力，谢谢大家了哈，下面我们开始吧！
一、css伪元素和伪类的区别
伪类和伪元素的区别，其实很简单，从字面上就可以理解。它们有一个共同的修饰词“伪”，那么“伪”是什么意思呢?就是假的。所以，伪类就是假的类，伪元素就是假的元素，这就是在字面上它们之间的区别。
The pseudo-class concept is introduced to permit selection based on information that lies outside of the document tree or that cannot be expressed using the other simple selectors.
大致翻译过来的意思就是：伪类存在的意义是为了通过选择器，格式化DOM树以外的信息以及不能被常规CSS选择器获取到的信息。
通过上面的概念我们知道了伪类的功能有两种：
1.格式化DOM树以外的信息。比如：标签的:link、:visited等。这些信息不存在于DOM树中。
2.不能被常规CSS选择器获取到的信息。比如：要获取第一个子元素，我们无法用常规的CSS选择器获取，但可以通过:first-child来获取到。
Pseudo-elements create abstractions about the document tree beyond those specified by the document language. For instance, document languages do not offer mechanisms to access the first letter or first line of an element's content. Pseudo-elements allow authors to refer to this otherwise inaccessible information. Pseudo-elements may also provide authors a way to refer to content that does not exist in the source document(e.g., the::before and::after pseudo-elements give access to generated content).
大致翻译过来的意思就是：伪元素可以创建一些文档语言无法创建的虚拟元素。比如：文档语言没有一种机制可以描述元素内容的第一个字母或第一行，但伪元素可以做到(::first-letter、::first-line)。同时，伪元素还可以创建源文档不存在的内容，比如使用::before或::after。
伪类和伪元素的区别(CSS3下的区别)
通过上面的概念，我们就可以知道伪类与伪元素最本质的一个区别：
1、伪类其实是弥补了CSS选择器的不足，用来更方便地获取信息。
2、而伪元素本质上是创建了一个虚拟容器(元素)，我们可以在其中添加内容或样式。
所以，你可以理解伪元素本质上是创建了一个虚拟容器(元素)了吧。
除了上面这个本质区别以外，在CSS3中：
3.伪类用单冒号:表示;而伪元素用双冒号::表示。
4.一个选择器可以同时使用多个伪类(但有的伪类会互斥);而一个选择器只能同时使用一个伪元素(未来的版本可能会支持多伪元素)。
关于CSS的更多详解，可以下看这个详细直观的视频教程，网页链接
二、如何使用 CSS3 伪类
1、E:link CSS1设置超链接a在未被访问前的样式。
2、E:visited CSS1设置超链接a在其链接地址已被访问过时的样式。
3、E:hover CSS1/2设置元素在其鼠标悬停时的样式。
4、E:active CSS1/2设置元素在被用户激活（在鼠标点击与释放之间发生的事件）时的样式。
5、E:focus CSS1/2设置元素在成为输入焦点（该元素的onfocus事件发生）时的样式。
6、E:lang(fr) CSS2匹配使用特殊语言的E元素。
7、E:not(s) CSS3匹配不含有s选择符的元素E。
8、E:root CSS3匹配E元素在文档的根元素。
9、E:first-child CSS2匹配父元素的第一个子元素E。
10、E:last-child CSS3匹配父元素的最后一个子元素E。
11、E:only-child CSS3匹配父元素仅有的一个子元素E。
12、E:nth-child(n) CSS3匹配父元素的第n个子元素E。
13、E:nth-last-child(n) CSS3匹配父元素的倒数第n个子元素E。
14、E:first-of-type CSS3匹配同类型中的第一个同级兄弟元素E。
15、E:last-of-type CSS3匹配同类型中的最后一个同级兄弟元素E。
16、E:only-of-type CSS3匹配同类型中的唯一的一个同级兄弟元素E。
17、E:nth-of-type(n) CSS3匹配同类型中的第n个同级兄弟元素E。
18、E:nth-last-of-type(n) CSS3匹配同类型中的倒数第n个同级兄弟元素E。
19、E:empty CSS3匹配没有任何子元素（包括text节点）的元素E。
20、E:checked CSS3匹配用户界面上处于选中状态的元素E。(用于input type为radio与checkbox时)
21、E:enabled CSS3匹配用户界面上处于可用状态的元素E。
22、E:disabled CSS3匹配用户界面上处于禁用状态的元素E。
23、E:target CSS3匹配相关URL指向的E元素。
24、@page:first CSS2设置页面容器第一页使用的样式。仅用于@page规则
25、@page:left CSS2设置页面容器位于装订线左边的所有页面使用的样式。仅用于@page规则
26、@page:right CSS2设置页面容器位于装订线右边的所有页面使用的样式。仅用于@page规则
三、css3的选择器有哪些
1、通配符选择器是用来选择所有元素，，也可以选择某个元素下的所有元素。
2、元素选择器，是css选择器中最常见而且最基本的选择器。
3、类选择器是以一独立于文档元素的方式来指定样式，使用类选择器之前需要在html元素上定义类名
4、ID选择器和上面说的类选择器是很相似的，在使用ID选择器之前也需要先在html文档中加注ID名称，这样在样式选择器中才能找到相对应的元素，不同的是ID选择器是一个页面中唯一的值，我们在类使用时是在相对应的类名前加上一个“.”号（.className）而id选择器是在名称前使用＂#＂如（#id）,
5、后代选择器也被称作包含选择器，所起作用就是可以选择某元素的后代元素，比如说：E
6、F，前面E为祖先元素，F为后代元素，所表达的意思就是选择了E元素的所有后代F元素，请注意他们之间需要一个空格隔开。
7、六、子元素选择器（E>F）
8、子元素选择器只能选择某元素的子元素，其中E为父元素，而F为子元素，其中E>F所表示的是选择了E元素下的所有子元素F。这和后代选择器（E
9、F）不一样，在后代选择器中F是E的后代元素，而子元素选择器E> F，其中F仅仅是E的子元素而以。
10、七、相邻兄弟元素选择器（E+ F）
11、相邻兄弟选择器可以选择紧接在另一元素后的元素，而且他们具有一个相同的父元素，换句话说，EF两元素具有一个相同的父元素，而且F元素在E元素后面，而且相邻，这样我们就可以使用相邻兄弟元素选择器来选择F元素。
四、css伪类选择器有哪些
用来匹配页面的URI中某个标识符的目标元素。
选择匹配E的所有元素，且匹配元素被相关URL指向。
当元素处于某种状态下时，才起作用，在默认状态下不起作用。
eg: input[type="checkbox"]:checked{}
eg: input[type="text"]:checked{}
eg: input[type="text"]:disabled{}
这个就比较多了，平时用的也比较频繁。
: root匹配元素所有在文档的根元素
: empty选择没有子元素的元素，且不包含节点
五、html 5 的CSS3新增的伪类选择器还包括哪些
1、:first-of-type p:first-of-type选择属于其父元素的首个<p>元素的每个<p>元素。
2、:last-of-type p:last-of-type选择属于其父元素的最后<p>元素的每个<p>元素。
3、:only-of-type p:only-of-type选择属于其父元素唯一的<p>元素的每个<p>元素。
4、:only-child p:only-child选择属于其父元素的唯一子元素的每个<p>元素。
5、:nth-child(n) p:nth-child(2)选择属于其父元素的第二个子元素的每个<p>元素。
6、:nth-last-child(n) p:nth-last-child(2)同上，从最后一个子元素开始计数。
7、:nth-of-type(n) p:nth-of-type(2)选择属于其父元素第二个<p>元素的每个<p>元素。
8、:nth-last-of-type(n) p:nth-last-of-type(2)同上，但是从最后一个子元素开始计数。
9、:last-child p:last-child选择属于其父元素最后一个子元素每个<p>元素。
10、:empty p:empty选择没有子元素的每个<p>元素（包括文本节点）。
11、:target#news:target选择当前活动的#news元素。
12、:enabled input:enabled选择每个启用的<input>元素。
13、:disabled input:disabled选择每个禁用的<input>元素
14、:checked input:checked选择每个被选中的<input>元素。
15、:not(selector):not(p)选择非<p>元素的每个元素。
16、::selection::selection选择被用户选取的元素部分。
关于本次css3伪类选择器和jquery的表单选择器的问题分享到这里就结束了，如果解决了您的问题，我们非常高兴。
