网站首页 > 技术文章 正文
区别
在 CSS 中伪类一直用 : 表示,如 :hover,:active 等
伪元素在 CSS1 中已存在,当时语法是用 :表示,如 :before 和 :after
后来在 CSS3 中修订,伪元素用 :: 表示,如 ::before 和 ::after,以此区分伪元素和伪类
由于低版本 IE 对双冒号不兼容,开发者为了兼容性各浏览器,继续使使用 :after 这种老语法表示伪元素
单冒号(:)用于 CSS3 的伪类
双冒号(::)用于 CSS3 的伪元素
想让插入的内容出现在其它内容前,使用::before,否则,使用::after;
在代码顺序上,::after 生成的内容也比::before 生成的内容靠后
如果按堆栈视角,::after 生成的内容会在::before 生成的内容之上
作用:
::before 和::after 的主要作用是在元素内容前后加上指定内容
伪类与伪元素都是用于向选择器加特殊效果
伪类与伪元素的本质区别就是是否抽象创造了新元素
伪类只要不是互斥可以叠加使用
伪元素在一个选择器中只能出现一次,并且只能出现在末尾
伪类与伪元素优先级分别与类、标签优先级相同
猜你喜欢
- 2024-11-14 Python Web全栈之旅09--Web前端●CSS浮动
- 2024-11-14 CSS 面试题:CSS的权重与优先级 css权重和优先级
- 2024-11-14 HTML/CSS 备忘录 - 12. CSS 浮动与定位
- 2024-11-14 Web前端开发-CSS布局-浮动和定位-入门干货
- 2024-11-14 前端初学者必看,这10 个CSS3 属性,你需要熟悉
- 2024-11-14 CSS学习之权重 css权重的计算方式
- 2024-11-14 css 绘制心形 css版心
- 2024-11-14 CSS 函数那些事(二)你不知道的 attr()
- 2024-11-14 如何解决after和before的兼容性 before和after用法
- 2024-11-14 CSS-西安钟楼 西安钟楼视频讲解
- 标签列表
-
- content-disposition (47)
- nth-child (56)
- math.pow (44)
- 原型和原型链 (63)
- canvas mdn (36)
- css @media (49)
- promise mdn (39)
- readasdataurl (52)
- if-modified-since (49)
- css ::after (50)
- border-image-slice (40)
- flex mdn (37)
- .join (41)
- function.apply (60)
- input type number (64)
- weakmap (62)
- js arguments (45)
- js delete方法 (61)
- blob type (44)
- math.max.apply (51)
- js (44)
- firefox 3 (47)
- cssbox-sizing (52)
- js删除 (49)
- js for continue (56)
- 最新留言
-