Home  >  Article  >  Web Front-end  >  CSS中的:after和:before的作用是什么_html/css_WEB-ITnose

CSS中的:after和:before的作用是什么_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:41:181516browse

CSS中的:after和:before的作用是什么:
在当前的页面布局中:after和:before伪对象选择符的使用频率好像并不怎么高,因为低版本IE浏览器并不支持,不过也在清除浮动或者一切其他相关布局中有它们应用的身影。不过随着低版本浏览器使用率的下降,它们出现的频率应该会相应的增加。下面就简单介绍一下这两个伪对象选择符的用法,先看一段代码实例:

     蚂蚁部落    
|div原来的内容

以上代码可以在div元素的内部前端添加指定的内容。当然:before伪对象选择符是和content属性配合使用实现的。
语法结构:

E:before{ Rules }E::before{ Rules }

E表示用选择器匹配的元素,例如:

div:before.first:before#mytest:before

在语法中可以看到有两种语法形式,一种是before前面有一个":",一种是before前面有两个":",第一种是CSS2的写法,第二个是CSS3的写法。IE7和IE7以下的浏览器并不支持CSS2写法,IE8和IE8以下浏览器并不支持CSS3的写法。:before伪对象选择符一般和content属性配合使用为指定匹配元素内部的前端添加指定内容。:after伪对象选择符的使用方式和:before的用是一样的,不介绍了。

原文地址是:http://www.51texiao.cn/div_cssjiaocheng/2015/0501/507.html

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn