妙味css3课程---1-2、css3中新增的伪类和伪元素有哪些

时间:2023-03-08 21:56:22

妙味css3课程---1-2、css3中新增的伪类和伪元素有哪些

一、总结

一句话总结:

1、div:target{}是什么意思?

比如a标签的锚点链接到div,div:target{}就可以找到这个div
E:target { sRules }
匹配相关URL指向的E元素。

妙味css3课程---1-2、css3中新增的伪类和伪元素有哪些

妙味css3课程---1-2、css3中新增的伪类和伪元素有哪些

2、如何用input框模拟单选框?

用input:checked属性可以找到我们点击的input框,然后就能实现背景发生改变,模拟选中
E:checked { sRules }
匹配用户界面上处于选中状态的元素E。(用于input type为radio与checkbox时)

妙味css3课程---1-2、css3中新增的伪类和伪元素有哪些

3、p::selection{}表示什么?

p::selection{}表示什么
表示p标签中被选中的内容,从而可以设置被选中内容的颜色
E::selection { sRules }
设置对象被选择时的样式。

4、E:after/E::after { sRules }如何使用?

E:after/E::after { sRules }如何使用
设置在对象后(依据对象树的逻辑结构)发生的内容。用来和content属性一起使用,并且必须定义content属性

5、伪类选择器中的单冒号和双冒号的区别和联系是什么?

CSS3将伪对象选择符(Pseudo-Element Selectors)前面的单个冒号(:)修改为双冒号(::)用以区别伪类选择符(Pseudo-Classes Selectors),但以前的写法仍然有效。

即E:after可转化为E::after

6、before和after有什么用(两种)?

不仅可以用新属性content添加内容,还可以添加样式,要配合content一起使用

二、css3中新增的伪类和伪元素有哪些

1、相关知识

2、代码