CSS伪元素 :after :befor

2016-11-3    分类: css基础教程,前端资源

:after :befor 主要是文本内容的插入

IE8支持 :符号

功能1:
.test:after{content:'123'}
<div class="test" id="aaa">插入的内容是:</div>

效果就是:
插入的内容是:123


功能2:
获取元素本身属性的值在插入内容
.test:after{content:attr(id)}
<div class="test" id="aaa">插入的内容是:</div>

效果就是:
插入的内容是:aaa

在css3中 ::after ::befor其实跟css2中的:after :befor功能是一样的,只是为了区别伪类选择符而已,即:(:hover这些)

在css3的语法中

:是伪类选择符

::是伪对象选择符

可以参考:https://www.xgllseo.com/book/css/selectors/pseudo-element/index.htm