CSS3伪元素选择器

伪元素选择器可以帮助我们利用css创建新标签元素,而不需要HTML标签,从而简化HTML结构!

选择符简介
::before在元素内部的前面插入内容
::after在元素内部的后面插入内容

注意:

  • before和after会利用css来创建一个元素,但是属于行内元素
  • 新创建的这个元素在文档树(代码)中是找不到的,所有称为伪元素
  • 语法:element::before{ }
  • before和after必须有content属性
  • before在父元素内容的前面创建元素,after在父元素内容的后面插入元素
  • 伪元素选择器和标签选择器一样,权重为1

语法:

div::before {
    content:'内容';
}

伪元素选择器属于行内元素,不能直接设置宽度高度,需要转换行内块元素!

div::before {
    display:inline-block;
    content:'内容';
}

配合字体图标使用

CSS3伪元素选择器

伪元素清除浮动

详见:清除浮动

版权声明:本文为本站原创文章,由37.2℃发表,转载请注明出处,保留一切权利!

转载请注明:转载于37.2度云笔记

发表评论

您的电子邮箱地址不会被公开。

微信
通知:站点改版中,敬请期待