伪类和伪元素

伪类与伪元素的区别:

1.伪类本质上是为了弥补常规CSS选择器的不足,以便获取到更多信息;

2.伪元素本质上是创建了一个有内容的虚拟容器

3.CSS3中伪类和伪元素的语法不同;   伪类  :link  :hover         伪元素  ::before    ::after

4.可以同时使用多个伪类,而只能同时使用一个伪元素;

5.其中伪类和伪元素的根本区别在于:它们是否创造了的元素,,   这个新创造的元素就叫  "伪无素"。

6.伪元素/伪对象:不存在在DOM文档中,是虚拟的元素,是创建新元素。 这个新元素(伪元素)  是某个元素的子元素,这个子元素虽然在逻辑上存在,但却并不实际存在于文档树中.

7.伪类:存在DOM文档中,(无标签,找不到,  只有符合触发条件时才能看到 ),  逻辑上存在但在文档树中却无须标识的“幽灵”分类。

8. 因为伪类是类似于添加类所以可以是多个,而伪元素在一个选择器中只能出现一次,并且只能出现在末尾 

伪类:用于向某些选择器添加特殊的效果

伪元素:用于将特殊的效果添加到某些选择器(标签

:after/::after和:before/::before的异同


相同点

1.都可以用来表示伪类对象,用来设置对象前的内容

2.:before和::before写法是等效的; :after和::after写法是等效的

不同点

1.:before/:after是Css2的写法,::before/::after是Css3的写法

2.所以css2的要比css3的兼容好    ,,  :before/:after 的兼容性要比::before/::after好 ,


不过在H5开发中建议使用::before/::after比较好

♥注意:

1.伪对象要配合content属性一起使用

2.伪对象不会出现在DOM中,所以不能通过js来操作,仅仅是在 CSS 渲染层加入

3.伪对象的特效通常要使用:hover伪类样式来激活


伪类&&伪元素

原:https://www.cnblogs.com/andy-lehhaxm/p/9561776.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容