如何在页面上获得页边空白？

Question

我正在为我的高中机器人团队开发一个网站，并且我希望为其中一个页面创建边距，但是当我将边距设置为自动或任何值时，它什么也不做。我正在使用bootstrap。

页我想对利润 - http://www.robotichive3774.com/Our%20Coach/

<div class="jumbotron"> 
    <h1>Our Coach, Marie Aloia</h1> 
    <p>Here you'll learn a little bit about our team coach.</p> 
</div> 
<div class="panel panel-default"> 
    <div class="panel-body" id="page-info"> 
    <ul class="List_Acc"> <!-- main list --> 
     <h2>List of Accomplishments</h2> 
    </ul> <!-- end main-list --> 
<ul class="list-group"><!-- main list --> 
     <h2>Colleges/degrees</h2> 
      <li class="list-group-item">Montclair University</li> 
       <ul class="list-group"> <!-- sub list --> 
        <li class="list-group-item">Math/Physics</li> 
       </ul> <!-- end sub-list --> 
      <li class="list-group-item">New Jersey Institute of Technology</li> 
       <ul class="list-group"> <!-- sub list --> 
        <li class="list-group-item">Chemical Engineering</li> 
       </ul> <!-- end sub-list --> 
    </ul> <!-- end main-list --> 
    <ul class="list-group"> <!-- main list --> 
     <h2>Prior Work History</h2> 
      <li class="list-group-item">Exxon Mobil Research and Development-20 years</li> 
      <li class="list-group-item">5 years at various High Technology Firms</li> 
    </ul> <!-- end main-list --> 
    <ul class="list-group"> <!-- main list --> 
     <h2>Memorable Students and their Accomplishments</h2> 
      <li class="list-group-item"><h4>Eric Delgado (Yale University)</h4></li> 
       <ul class="list-group"> <!-- sub list --> 
        <li class="list-group-item">Science Talent Search Finalist</li> 
       </ul> <!-- end sub-list --> 
      <li class="list-group-item"><h4>Dan Borowski (Rutgers University)</h4></li> 
       <ul class="list-group"> <!-- sub list --> 
        <li class="list-group-item">Google Computer Science Summer Institute</li> 
       </ul> <!-- end sub-list --> 
      <li class="list-group-item"><h4>Sharif Abdelbaky (University of Pittsburgh)</h4></li> 
       <ul class="list-group"> <!-- sub list --> 
        <li class="list-group-item">NASA Robotics Intern-ship</li> 
        <li class="list-group-item">Google Computer Science Summer Institute</li> 
       </ul> <!-- end sub-list --> 
      <li class="list-group-item"><h4>Gemma David (Rutgers University)</h4></li> 
       <ul class="list-group"> <!-- sub-list --> 
        <li class="list-group-item">Founder of FTC Team 3774</li> 
        <li class="list-group-item">Attended New Jersey Governors School</li> 
       </ul> <!-- end sub-list --> 
    </ul> <!-- end main-list --> 
    <ul class="list-group"> 
     <h2>Organizations</h2> 
      <li class="list-group-item">Society for Women Engineers</li> 
    </ul> 
    </div> 
</div> 


</body> 
</html> 

CSS

.banner 
{ 
float: bottom; 
} 

#top-jumbotron 
{ 
    padding-left:0; 
    padding-right:0; 
    padding-bottom:0; 
    margin-bottom: 0; 
} 

#page-info 
{ 
margin-left: auto; 
margin-right: auto; 
} 

body 
{ 
background-image: url("robots2.png"); 
} 

Answer 1

包你想在页面中间的代码（即利润）在容器：

<div class="container"> 
    your code in here... 
</div> 

bootstrap中的容器是使内容位于中间的部分页面

的你很可能把该容器中的开口的口主体标记后直接和您