CSS:不工作后

时间:2017-04-26 02:45:31

标签: css opacity

我试图让背景图片变得透明,我知道我可以通过在CSS中添加不透明度来实现它:之后。但似乎我的代码编辑脚本或CSS有问题,我不知道为什么。

我试图查看我的代码有什么问题。我期待看到这段代码的红色背景,但我看不到任何红色

<head>
<style type="text/css"> #chattingBox:after { background-color: red !important;}</style>
</head>
<body>
<div id="chattingBox" style="overflow: scroll; height: 150px; border: 1px solid black; background: url("/images/large/5.png") center center / 100px no-repeat;"></div>
</body>

当我把CSS写成&#39; #chattingBox {background ...&#39;(没有:之后)时,我可以看到红色,所以我想它的问题是:之后我不会&#39我有任何想法来解决这个问题。

如果:问题解决后,我也可以设置不透明度,有人知道原因:以后不行吗?

1 个答案:

答案 0 :(得分:6)

那是因为你的:after伪元素是空的。如果您添加一些内容,例如:

#chattingBox:after {
    content: "\A0";
    background-color: red !important;
}

然后你会看到一些东西。 \A0是非中断空间的代码(相当于tHTML &nbsp;,但任何内容都可以。

通常情况下,:after:before在没有某种content的情况下是不完整的。