html - 使用css设置背景覆盖的透明度

标签 html css

下面是设置背景封面的代码,我想设置背景封面的透明度,这样我就可以在上面显示一些文字。我得到了如下解决方案,但它对我不起作用。我不知道我想念它的地方。

 style="background: url(images/football_ground.jpg) no-repeat center center fixed;-webkit-         
     background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;-moz-opacity:.30; 
filter:alpha(opacity=30); 
-khtml-opacity: 0.3;  ">

最佳答案

目前,CSS 不允许更改背景图像的 alpha 值。如果你想解决这个问题,有几个不同的选择:

  1. 只需将您的背景图像保存为具有适当不透明度的透明 png。
  2. 使背景图像成为相对定位的父容器中自己的绝对定位元素。

.

<div class="parent">
    <div class="background"></div>
    <div class="foreground">some text</div>
</div>

关于html - 使用css设置背景覆盖的透明度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14537698/

相关文章:

javascript - 为什么这个长度函数未定义?

html - Three.js 视频背景静态摄像头

html - 如何避免 <a> 显示为 :block takes whole width?

javascript - 使用媒体查询和 JavaScript 构建 HTML5 响应式菜单

html - li span 没有左对齐

javascript - 调用 javascript 函数以从无法按预期工作的表单进行 AJAX 调用

html - "Failed to load resource: the server responded with a status of 404 (Not Found) "和 403 forbidden(但在 codepen 和 localhost 中工作正常)

javascript - JS Slice() 不能正常工作

html - IE7 float :right drops next to float:left

html - 字体不显示的问题