CSS3选择器真有特殊含义?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了CSS3选择器真有特殊含义?相关的知识,希望对你有一定的参考价值。

参考技术A 一、首先是C3属性选择器

1. 每一个标签都有自己的属性,是吧?要给它一个样式,就可以通过它的属性来找到它。

2. 属性选择器的权重是10

3. 都有哪些?

- 标签名[属性名]

- 标签

- 标签名[type="属性名"]

- ^= 以icon开始的选出来

- $= 以icon结尾的选出来

- *= 代表任意位置,包含该属性的就要选出来

例子

二、结构伪类选择器

语法:

nth-child(n) 释义:

- 想要选哪个n就在那个里面输入数字几就可以了

- 这里的n 可以有特殊数值偶数even 奇数odd 有利于做隔行变色

- n可以是公式

- -n+5选出前5个。

例子

三、ntf-of-type 选择器

先上总结:

- nth-child(n) 选择父元素里面的第一个 n个孩子

- of-type 选择指定类型的元素

例子

四、伪类选择器

方式一 ::before ::after

方式二 :before :after

总结:伪元素前面可以是一个冒号,也可以是两个冒号,不影响结果

例子

以上是关于CSS3选择器真有特殊含义?的主要内容,如果未能解决你的问题,请参考以下文章

CSSCSS2和CSS3选择器总结(全部选择器种类及其优先级)

伪类选择器与伪元素选择器的区别

CSS3选择器入门

可缩放时间轴和录像片段选择器的实现

CSS3 选择器

css3选择器怎样选择元素?