css - 摆脱图像中不需要的 CSS 不透明度？

Question

我正在设置我的 WordPress 网站，我正在使用不透明度让背景图像“闪耀”，这很好地展示了视差滚动效果。问题是背景图像也照在不透明的前景图像上!

参见 http://csr-kommunikation.se/billig-hemsida-till-foretaget-blir-ofta-dyr-historia/

尝试编辑样式表 (style.css)，但我不知道如何摆脱它。 html结构是这样的

<article>
  <div>
    <p>
      <img> [the image with the problem AND text]

我尝试过的:

• 添加“不透明度:1.0；” img、div 和文章类样式，以及只有在 article 中才生效。 (但后来我失去了背后的不透明度文本也是。)
• 将“z-index: 10000; !important”添加到 img 类。没有效果。

我还没有尝试过的:

• 在页面源代码中，图像也有类“wp-image-603”，但我找不到在哪里编辑 wp-image 类，因为它不在我的主题 CSS。不知道这是否可以解决。

我使用的是最新版本的 Chrome (36)，我也尝试过在 Opera 中查看该页面，但它看起来一样。 (或者我应该说“看起来”，现在看起来显然是废话......)

Answer 1

您当前正在使整个 article 标签变成半透明的，所以里面的任何东西也将是半透明的。而不是你目前在这里做的事情:

article {
    background: #fff;
    opacity: 0.95;
}

使用:

article {
    background: rgba(255, 255, 255, 0.95);
}

这只会将白色背景的不透明度更改为 0.95，同时保持内容不变。