使用CSS的content来替换HTML元素

2022-01-02

CSS的content属性一般是常用来设置HTML伪元素的,应用场景如:设置font字体图标、定义显示的字符、设置伪元素为块元素来做一些CSS效果。后来随着CSS的发展,新的规范特性允许content可以对普通元素进行内容替换,不过目前仅支持url()资源替换,暂不支持字符内容替换。示例代码如下:

<div class="test">我是文字</div>
<style>
.test{
  width:100px;height:100px;
  content: url(image.jpg);
}
</style>

应用css之后,div的内容会被替换为一张图片,图片的宽度和高度即是div的宽度和高度。

上一篇:没有了
下一篇:2021年起百度不收录未备案网站