一、事由
今天我在写项目的时候,突然发现:before和::before都可以是实现效果,好奇二者的区别的,故写下这篇文章。
二、分析
2.1 相同之处
:before和::before写法等价,两者都是伪类元素,其原理和功能都是相同。
2.2 不同之处
element:after { style properties } /* CSS2 语法 */
element::after { style properties } /* CSS3 语法 */
::after表示法是在CSS 3中引入的,::符号是用来区分伪类和伪元素的。支持CSS3的浏览器同时也都支持CSS2中引入的表示法:after。
三、拓展
伪元素是一个附加至选择器末的关键词,允许你对被选择元素的特定部分修改样式。
注意:按照规范,应该使用双冒号(::)而不是单个冒号(:),以便区分伪类和伪元素。但是,由于旧版本的 W3C
规范并未对此进行特别区分,因此目前绝大多数的浏览器都同时支持使用这两种方式来表示伪元素。