css中before伪元素background不显示的解决办法-个人博客网站搭建

让我们先来看一段代码，这是正确的能够显示before伪元素的写法，然后在说注意事项，代码如下：
  .rcon .zztj p:before{content: '';
    position: absolute;
    background: url(../images/contb.png) no-repeat;
    width: 12px;
    height: 15px;
    margin: 2px;
left: 0; background-size:contain}
如上面的代码"background: url(../images/contb.png) no-repeat;"，表示在p:before里加上了背景图片，这里要注意几个重要设置才能正确显示出来背景图片：
1. content: ' '，这个是before元素必须首先设置的，无论写在哪里都要设置，否则before标签就不起作用。
2. position: absolute，这个一定要设置好绝对定位，否则就显示不出来。
3. background-size:contain，这个是调整图片尺寸的，也要设置，要不我们图片放大缩小就不太好用 。

最终效果如下，最左边的黄色小图标显示出来了。 点赞作者

PS：本文来自万书涛的个人博客，感谢分享。