Question

我的页面上有一个完整的页面背景图像，使用以下CSS：

.full {
background: url(images/background.png') no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

这是附加到HTML类：

<html class="full">

我现在正尝试使用基本内容将内容放在首位：

<div class="container">Text Here</div>

结果导致容器将背景图像向下推并将内容放在其上方。如何让这些内容浮动在图像上？

Answer 1

您的问题可能是bootstrap.css中的这一行

body {
  background-color: #FFF;
}

哪些可能给人的印象是你的背景图片被压下，但实际上只是将容器内容的高度应用于图像的白色背景。

解决此问题的一个选项是覆盖自定义css中的body css：

body {
  background: transparent;
}

Bootstrap 3整页图像背景

1 个答案: