html - 在没有其属性的 div 中有图像

标签 html css

我想在背景颜色较暗的 div 中放置一张图片,这也影响了我的图片。我怎样才能将我的图像放在同一个 div 中,但在顶部有一层,这样它就不会受到调光颜色的影响。

.testimonial .cover {
    background-color: rgba(0, 7, 11, .87)
}

<div class="testimonial">
   <div class="cover"></div>
   <img "This is the image i want to be a layer on top">
</div>

最佳答案

此设置:

background-color: rgba(0, 7, 11, .87);

包含一个不透明度参数 (0.87)。此不透明度(部分透明)会影响该 DIV 的内容(例如文本),但不应影响 <img> 中的图像。标签

不过,如果您更改该值 .871.0 ,整体印象肯定会有所不同。

示例:http://codepen.io/anon/pen/PZZOLO 如果您更改背景颜色的不透明度,(浅蓝色)图像不会改变。

关于html - 在没有其属性的 div 中有图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34302546/

相关文章:

javascript - 如何在数据库中插入数据后重新加载页面

javascript - 元素边框上的html鼠标悬停事件

javascript - JSFiddle 示例在网络上工作但在我的电脑上不工作

HTML 字体系列设置

css - SCSS 到 CSS - 如何修复媒体查询

html - 侧身头球

html - 在某些 wordpress 用户名旁边添加 "flair"

css - 防止Edge中的高对比度模式为文本添加背景

c# - 在 HTML5 CSS 或 C#.NET 中裁剪图像

CSS 图像 mask ,带有 % 高度的 img