CSS中的content=“”

有很多css里面有这样的语句

xxx:before {

content="";
...
...

}

这个有什么作用?我知道这个是在XXX的前面添加内容的,我只是不懂为什么很多CSS里面都像这样添加空内容,好像和float有关什么的,不是很懂

阅读 4.5k
7 个回答

添加空内容的目的不是要要插入内容,而是想在这个DOM元素内模拟一个DOM元素,来完成一些CSS样式上的工作,这样可以不增加无用的DOM标签

清除float的浮动

:before 选择器在被选元素的内容前面插入内容。content里面写内容

在伪类选择器中,填充的内容。别如,p:before{content:"这里的文字将会出现在p标签内容额的前面"}

当你把content这句省略的话,before添加的那个元素即使加上高宽或其他什么,也无法让其起作用,html元素里面是看不到的,添加一个content空内容的话就可以看到作用了。
可能描述不太准确,大概是这个意思。

你可以把它视为一个标签,也可以把它视为一个标签的附加标签。
在有些时候,例如文字前后都加icon,与其写几个标签来控制不如用:before :after

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题