html - 将 div 置于背景图像之上

标签 html css

我正在尝试做一些看起来应该很简单的事情。我只想在背景图像上放置一个 div(一个矩形)。 div 不会显示为覆盖在背景图像之上。 div 实际上根本不会显示。除了使用绝对位置外,我还尝试使用 z-index 将 div 移动到图像前面,但都没有成功。这是我的 html 和 CSS:

<div id="banner-contact">
            <div id="background-contact-info-contact"></div>
            </div>  
        </div>

CSS:

#banner-contact{
    width: 100%;
    height:1000px;
    background-image:url('resized-images-logo/contact-page-resized.jpg');
    background-repeat:no-repeat;
    background-size:cover;
    margin:0px;

}
#background-contact-info-contact{
    width:24%;
    height:auto;
    background-color:#C16C43;   
}

最佳答案

height: auto 表示 div 的高度等于它的子元素的高度。默认情况下,Div 的高度是自动的。

关于html - 将 div 置于背景图像之上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47733258/

相关文章:

html - 在没有水平滚动的情况下,使 HTML 内容居中比浏览器更宽?

html - HTML 和 Photoshop 中的 RGB 颜色

javascript - Angular 2 - 带有 Assets 的网址

带有图形/codepen 的 CSS 后续转换

jquery 更改多个背景上的 css 背景位置

java - 瓦丁 8 : change background color of description (tooltip)

javascript - JQuery - select val() 仅返回下拉列表的第一个值

javascript - 当文本显示在浏览器页面上时,字符未转义

html - 在 Web 应用程序中更改 css 文件

CSS 文本样式