充分的身体背景与Twitter Bootstrap [英] Full body background with Twitter Bootstrap
问题描述
我试图使用Twitter的Bootstrap框架来开发一个新项目,但我遇到了一个问题。我想要一个全身背景,但背景似乎被限制在容器div的高度。这里是HTML / CSS代码:
I am trying to work on a new project using Twitter's Bootstrap framework, but I am having an issue. I want a full body background, yet the background seems to be limited to the height of the container div. here is the HTML/CSS code:
<!doctype html>
<html lang="en">
<head>
<meta charset='UTF-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.3.0/bootstrap.min.css">
<title>Bootstrap Issue</title>
<style>
body { background: black; }
.container { background: white; }
</style>
</head>
<body>
<div class="container">
<h1> Hello, World!</h1>
</div>
</body>
</html>
如何让身体占据整个屏幕?
How can I get the body to take up the entire screen?
推荐答案
您需要添加以下内容:
html { background: transparent }
Or, set the "page background" (background: black
) on html
instead, which is fine to do.
为什么?在Bootstrap中,有:
Why? Inside Bootstrap, there's this:
html,body{background-color:#ffffff;}
(注意默认背景
值是
)
有关此问题的原因的详情,请参阅: / a>
For more information on why this matters, see: What is the difference between applying css rules to html compared to body?
请注意,这不再是Bootstrap 3 +的问题。
Note that this is no longer an issue with Bootstrap 3+.
这篇关于充分的身体背景与Twitter Bootstrap的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!