Bootstrap Introduction
Bootstrap it before jQuery, which is meant to be used to import jQuery based Bootstrap File
3.x version is recommended, do not use the latest version
Bootstrap features: only modify the style class attribute is to modify the page
Instructions:
Download: https: //v3.bootcss.com/
The second is a reference to a cdn address:
Layout container
<div class = "container"> </ div> around a fixed blank
<div class = "container-fluid c1"> </ div> Full Screen Display
Grid System
A row says a line, this line to your default were divided into 12 parts, each one you can also be divided into 12 parts
class = div "Container"> < div class = "Row" > line < div class = "COL-md-6 c1" > </ div > control your account how many columns of the current row
With Google browser automatically switch your phone or computer screen, just add a col-xs-6 generates the corresponding layout
Column offset
使用 .col-md-offset-* 类可以将列向右侧偏移。这些类实际是通过使用 * 选择器为当前元素增加了左侧的边距(margin)。
例如,.col-md-offset-4 类将 .col-md-4 元素向右侧偏移了4个列(column)的宽度。 <div class="row"> <div class="col-md-4">.col-md-4</div> <div class="col-md-4 col-md-offset-4">.col-md-4 .col-md-offset-4</div> </div>
表格标签
<table class="table table-bordered table-hover table-striped"></table> <tr class="active">...</tr>
按钮
<button class="btn btn-success">button</button> <button class="btn btn-info">button</button> <button class="btn btn-warning">button</button> <button class="btn btn-danger">button</button> <button class="btn btn-primary">button</button> <a href="http://www.xiaohuar.com" class="btn btn-primary">Link</a>