css - css不透明度背景不影响图像

Question

我希望每个帖子的白色背景都有一点不透明效果，所以我做了：

.post{
    background: white;
    opacity: 0.75;
    border-radius: 0px 0px 6px 0px; 
    }

现在每个帖子中的图像也得到了不透明效果，这是我不想要的，我该如何解决这个问题？

网站： http ://crystalise.tw/xi/

Answer 1

opacity适用于背景和内容。
您可以使用background rgba来定义半透明背景。

.post{
   background: #FFF; /* Solid white for old browsers */
   background: rgba(255,255,255,0.75); /* 0.75 opacity background white for modern browsers */
   border-radius: 0px 0px 6px 0px;
}

Answer 2

尝试使用 RGBA 颜色，这些颜色与带有 alpha（或透明度值）的 RGB 格式相同。

在您的示例中， 75% 白色将变为rgba(255, 255, 255, 0.75)

您应该将代码更改为：

.post{
    background: rgba(255, 255, 255, 0.75);
    border-radius: 0px 0px 6px 0px; 
}

您可以使用在线转换器更改 HEX (#FFFFF) RGB (255,255,255) 和 HTML（白色）颜色，其中许多在线存在。