My前端bootstrap（一）

時間 2019-12-09

原文原文鏈接

格網系統(Grid System).默認的Bootstrap格網系統提供一個寬達940像素的,12列的格網。這意味着你頁面默認寬度是940px,最小的單元要素寬度是940/12px.Bootstrap可以使得你的網頁能夠更好地適應多種終端設備(平板電腦，智能手機等)。默認格網系統直觀概念如圖1-1所示：
css

在bootstrap中實現嵌套列很是簡單，只須要在原有的div中加入.row 和相應的長度的span* div便可。html

<div class="row">
  <div class="span12">
    Level 1 of column
    <div class="row">
      <div class="span6">Level 2</div>
      <div class="span6">Level 2</div>
    </div>
  </div>
</div>

將.row 改爲.row-fluid ，就能夠將fixed行改成fluid.也就是流式格網系統html5

<div class="row-fluid">
  <div class="span4">...</div>
  <div class="span8">...</div>
</div>

固定佈局git

<body>
  <div class="container">
    ...
  </div>
</body>

流佈局github

<div class="container-fluid">
  <div class="row-fluid">
    <div class="span2">
      <!--Sidebar content-->
    </div>
    <div class="span10">
      <!--Body content-->
    </div>
  </div>
</div>