css透明体不包括图像

Question

我有这个代码

    body {
        background-color: #808080;
        background-image: url('/Content/img/emboss.png');
        background-repeat: no-repeat;
        background-position: center 250px;
        font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
        font-size: 10pt;
        opacity: 0.8;
    }
    img {
        opacity: 1;
    }

但是它不起作用。整个网站，每个元素的不透明度都是 0.8，这正是我想要的，而且看起来很完美。但是，在渲染图像时我不需要任何透明度。

我将如何在我的 CSS 中执行此操作

Answer 1

您可以使用一些小技巧来实现。使用 :not 伪选择器，如下所示。

 body {
    background-color:#808080;
    background-image: url('/Content/img/emboss.png');
    background-repeat: no-repeat;
    background-position: center 250px;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    font-size: 10pt;
   }
   body :not(img)
   {
    opacity:0.7;
   }

DEMO