:before和::before的区别

转载 2015年07月07日 14:11:29

在一次项目中,有一次要用到::selection伪元素,然后开发同学问我,CSS中一个冒号和两个冒号有神马区别?

这好像真的是个问题,或许很多前端同学对此都有疑惑,查了些资料,证实了下两个符号的区别,简而言之:单冒号(:)用于CSS3伪类,双冒号(::)用于CSS3伪元素

W3C关于CSS3选择器的规范中有一段描述:

A pseudo-element is made of two colons (::) followed by the name of the pseudo-element.
This :: notation is introduced by the current document in order to establish a discrimination between pseudo-classes and pseudo-elements. For compatibility with existing style sheets, user agents must also accept the previous one-colon notation for pseudo-elements introduced in CSS levels 1 and 2 (namely, :first-line, :first-letter, :before and :after). This compatibility is not allowed for the new pseudo-elements introduced in CSS level 3.

简单翻译一下,大意就是,伪元素由双冒号和伪元素名称组成。双冒号是在当前规范中引入的,用于区分伪类和伪元素。不过浏览器需要同时支持旧的已经存在的伪元素写法,比如:first-line、:first-letter、:before、:after等,而新的在CSS3中引入的伪元素则不允许再支持旧的单冒号的写法。

那么现在就可以完整的回答标题中的问题了,对于CSS2之前已有的伪元素,比如:before,单冒号和双冒号的写法::before作用是一样的

所以,如果你的网站只需要兼容webkit、firefox、opera等浏览器,建议对于伪元素采用双冒号的写法,如果不得不兼容IE浏览器,还是用CSS2的单冒号写法比较安全。

Web前端面试指导(十二):::before 和:before有什么区别?

题目点评 这个问题看来很简单,但如果之前没有琢磨这个问题,给人感觉也是门头一垂,听到这个题目就懵逼了,因为原来从来没有注意过这个问题,即便有注意这个问题也不能很好的回答清楚。回答的技巧就是从相同点和...
  • lxcao
  • lxcao
  • 2016年09月23日 17:40
  • 2279

触发器里面before和after的区别

关键字before和after用于标识触发时间,顾名思义,before代表触发器里面的命令在DML修改数据之前执行,after代表触发器里面的命令在DML修改数据之后执行。    读者可以结合应用场景...
  • zhangzl1012
  • zhangzl1012
  • 2017年10月09日 22:29
  • 341

oracle 触发器before和after数据区别

create or replace trigger "test" before insert on mh_task for each row declare       PRAGMA  ...
  • windhawk777
  • windhawk777
  • 2014年07月28日 15:35
  • 764

jQuery before和insertBefore区别

jQuery 中利用before和insertBefore可以达到在指定元素前插入指定内容,写法上有区别 先看一个例子: 在toInsertContent前面插入toInsertContent ...
  • taoerchun
  • taoerchun
  • 2015年09月30日 10:34
  • 3157

mysql之触发器before和after的区别

mysql之触发器before和after的区别 我们先做个测试: 接上篇日志建的商品表g和订单表o和触发器 假设:假设商品表有商品1,数量是10; 我们往订单表插入一条记录: inse...
  • sustskd
  • sustskd
  • 2014年09月28日 16:28
  • 1211

jq中append()、prepend()、after()、before()的区别详解

1、append() - 在被选元素的结尾插入内容(内容的结尾,比如说有个a标签,则是在这个标签之前添加东西)2、prepend() - 在被选元素的开头插入内容(内容的开始,比如说有个a标签,则是在...
  • qq_26291823
  • qq_26291823
  • 2016年01月07日 20:35
  • 10886

before用双冒号与单冒号的区别

:before和::before的区别 在一次项目中,有一次要用到::selection伪元素,然后开发同学问我,CSS中一个冒号和两个冒号有神马区别? 这好像真的是个问题,或许很...
  • u014516981
  • u014516981
  • 2016年09月22日 23:23
  • 3523

聊聊高并发(三十六)Java内存模型那些事(四)理解Happens-before规则

在前几篇将Java内存模型的那些事基本上把这个域底层的概念都解释清楚了,聊聊高并发(三十五)Java内存模型那些事(三)理解内存屏障 这篇分析了在X86平台下,volatile,synchronize...
  • ITer_ZC
  • ITer_ZC
  • 2014年12月19日 11:53
  • 5797

spring AOP @Around @Before @After 区别

开源中国 代码分享 当前位置:代码分享 » Java  » 编程基础 搜 索 spring AOP @Around @Before @Af...
  • evilcry2012
  • evilcry2012
  • 2015年10月20日 11:24
  • 515

捕获SceneControl的BeforeDraw、AfterDraw事件

由于捕获BeforeDraw与AfterDraw事件的方法相同,我们以AfterDraw为例进行说明。首先我们来看看什么时候用到BeforeDraw和AfterDraw。 在AE的帮助文档中,Befo...
  • sunqunsunqun
  • sunqunsunqun
  • 2012年02月22日 11:26
  • 2665
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章::before和::before的区别
举报原因:
原因补充:

(最多只允许输入30个字)