我想在一个全宽的部分中添加背景图片
。但我无法弄清楚使用 background-image
在 CSS 中添加图像的正确方法是什么。
所以,这是我的代码:
HTML
<section id="main-banner">
<div class="banner">
<h1>This H1 title</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque at tempor turpis. Suspendisse mattis, est eget volutpat elementum, lacus odio euismod ipsum, a placerat ligula mi ut nibh. In vitae leo facilisis, accumsan massa ultrices,</p>
</div>
</section>
CSS
#main-banner {
background: url('../img/banner-img.png') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
我的图片显示不正确。
最佳答案
试试这个
#main-banner {
background: url('../img/banner-img.png') no-repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
min-height:300px;
}
关于html - 在 CSS 中添加背景图片的正确方法是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42478440/