我为我的虚假业务建立了一个网站，但我无法让页面底部的区域不存在。所以更多信息，我希望整个页面占据所有浏览器窗口，并且在所有计算机上没有任何空白或有任何滚动，在屏幕更高或更短的计算机上，我希望文本保持在中心在导航栏和页面末尾之间。
提前致谢。
HTML：
<!DOCTYPE html>
<html>
<head>
<title>Geer Creations</title>
<!-- Icon -->
<link rel="shortcut icon" href="logo-inverse.ico" >
<!-- Fonts -->
<link href='http://fonts.googleapis.com/css?family=Ubuntu:400,700' rel='stylesheet' type='text/css'>
<!-- Bootstrap core CSS -->
<link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles -->
<link href="main.css" rel="stylesheet">
</head>
<body>
<div class="page">
<div class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><img style="max-width:50px; margin-top: -7px;" src="http://i1284.photobucket.com/albums/a579/Ian_Geer/logo-inverse_zps3767ce84.png"></a>
</div>
<div class="collapse navbar-collapse" id=".navbar-ex1-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Browse</a></li>
<li><a href="#">Contact</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Sign Up</a></li>
<li><a href="#">Login</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="jumbotron">
<div class="container">
<h1>We combine strategy, creative thinking, & technology to drive results.</h1>
<button type="button" class="btn btn-default btn-lg">Learn More</button>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
</body>
</html>
CSS：
body {
font-family: 'Ubuntu', sans-serif;
}
.navbar {
background-color: #fff;
border: none;
padding-top: 10px;
}
.navbar .nav {
margin-top: 5px;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
color: #ff9721;
background-color: #fff;
font-weight: 700;
}
.navbar-default .navbar-nav > li > a {
-webkit-transition: color .2s; /* For Safari 3.1 to 6.0 */
transition: color .2s;
color: #6E6E6E;
background-color: transparent;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
-webkit-transition: color .2s; /* For Safari 3.1 to 6.0 */
transition: color .2s;
color: #ff9721;
background-color: transparent;
}
h1 {
color: #fff;
text-align: center;
}
.jumbotron {
padding-top: 190px;
padding-bottom: 173px;
margin-right: auto;
margin-left: auto;
width: 100%;
background-color: #170D00;
color: #fff;
text-align: center;
}
.jumbotron h1 {
font-size: 3em;
}
.form-control {
margin-top: 5px;
border-radius: 20px;
}
.btn {
-webkit-transition: color .5s, border .5s; /* For Safari 3.1 to 6.0 */
transition: color .5s, border .5s;
margin-top: 50px;
color: #fff;
background-color: transparent;
border: 2px solid #fff;
width: 220px;
}
.btn:hover,
.btn:focus {
-webkit-transition: color .5s, border .5s; /* For Safari 3.1 to 6.0 */
transition: color .5s, border .5s;
margin-top: 50px;
color: #ff9721;
background-color: transparent;
border: 2px solid #ff9721;
width: 220px;
}