Css3选择器基础知识有哪些

这篇文章主要介绍“Css3选择器基础知识有哪些”的相关知识，小编通过实际案例向大家展示操作过程，操作方法简单快捷，实用性强，希望这篇“Css3选择器基础知识有哪些”文章能帮助大家解决问题。

芦山网站制作公司哪家好，找创新互联公司！从网页设计、网站建设、微信开发、APP开发、响应式网站设计等网站项目制作，到程序开发，运营维护。创新互联公司从2013年成立到现在10年的时间，我们拥有了丰富的建站经验和运维经验，来保证我们的工作的顺利进行。专注于网站建设就选创新互联公司。

div > p选择父元素为div的所有子元素。

div + p选择紧接在div后的所有子元素。

[target]选择带有target属性的元素 a[target] {...}

[target=_blank]选择target为_blank的所有子元素。

[title~=flower]选择title属性包含单词flower的元素。

[lang|=en]选择lang属性以en开头的所有元素。

[p:first-letter]选择p元素开头的所有首字母。

[p:first-line]选择每个p元素的首行。

[p:first-child]选择属于其父元素的首个子元素的每个

元素就是相对比某个父元素下的所有p元素的第一个p必须声明。

[p:before]在每个p元素之前插入内容 p:before{content:"台词：";} ::css3写法 : css2写法。

[p:after]在每个p元素后插入内容。

[p:lang(it)]选择带有以 "it"开头的 lang属性值的每个

元素。

[p~ul]选择前面有

元素的每个

a[src^="https"]选择所有a属性中src以https开头的 ^表示开头。

a[src$=".pdf"]选择所有a中属性src以pdf结尾的 $表示结尾。

a[src*="abc"]选择所有a中属性src包含abc的元素。

div p:first-of-type div下首个p元素 p可以不是第一个。

div p:last-of-type div下最后一个p元素。

div p:only-of-type div中只有一个p元素可以包含其他元素。

div p:only-child div中只有一个p元素不能包含其他元素 ie不支持。

div p:nth-child（2） div下第二个p元素。

div p:nth-last-child(2) div下倒数第二个p元素 Odd和 even是可用于匹配下标是奇数或偶数的子元素的关键词使用公式 (an + b)。描述：表示周期的长度，n是计数器（从 0开始），b是偏移值。

div p:nth-of-type(2) div下第二个p 2可以用奇偶数可以用公式。

div p:nth-last-of-type(2) div下倒数第二个p。

div p:last-child div下最后一个p相当于div p:nth-last-child(1)。

p:empty选择没有子元素的每个

元素（包括文本节点）。

#news:target选择当前活动的 #news元素。

input:enabled input:disabled input:checked(只有 Opera支持 :checked选择器。

input[type="text"]:enabled为所有 type="text"的已启用的 input元素设置背景色。

关于“Css3选择器基础知识有哪些”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识，可以关注创新互联行业资讯频道，小编每天都会为大家更新不同的知识点。

建站动态