html - 如何使用 CSS 不透明度让背景在 IE8 中渗透?

标签 html css

我有一个带有粉红色背景图像的 HTML 页面。我想在页面上为文本定义一个 DIV,但我希望背景在 DIV 中显示得更浅,几乎是白色。我试过了,但它似乎不适用于 IE8。

我的 HTML...

<html>
  <head>
    <link href="styles.css" rel="stylesheet" type="text/css">
  </head>
<body>

<div class="div1">
testing
</div>

</body>
</html>

这是我的 CSS 文件 ...

body
{
background-image:url('back.jpg');
background-repeat:repeat;
} 

.div1
{
opacity:0.4;
filter:alpha(opacity=40); /* For IE8 and earlier */
background: #ffffff;
}

有什么想法吗?

最佳答案

您必须牢记的是,不透明度属性会影响整个 元素的不透明度,包括其文本/子元素。如果您只想影响背景,则需要以不同的方式处理它。

您可以为现代浏览器使用 RGBA:

.div1 {
  background-color: rgba(255,255,255, .4);
}

然后,在单独的 IE 样式表中(使用条件注释或类似方法):

.div1 {
  background: transparent url(white_trans.png);
 }

您需要制作一张 PNG-24 图像,1 像素 x 1 像素,只是将白色降低到 40% 的不透明度。这将适用于 IE7 和 8。

关于html - 如何使用 CSS 不透明度让背景在 IE8 中渗透?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9261425/

相关文章:

javascript - 启用自动完成的输入类型密码。 val() 变成空白

javascript - 单击 anchor 标记时如何显示和隐藏输入?

Jquery Fadein 切换保持闪烁(使用 wordpress)

css - 是否有用于包含特定文本的元素的 CSS 选择器?

html - 如何使用 htaccess 将 website.com/和 website.com/index.php 重定向到另一个页面

html - 相邻的两张图片

javascript - 使用 Javascript 切换 CSS 显示设置

html - 响应式设计中固定大小的 iframe

html - CSS 2x3 网格布局问题

html - 在 Bootstrap 4/SASS 中使用媒体断点 - _breakpoints.scss 不知道 $grid-breakpoints