使用Bootstrap设计响应式页面

使用Bootstrap也很是简单,你只须要把下面的连接添加到你须要使用Bootstrap来进行布局的应用的头部：

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap /3.3.1/css/bootstrap.min.css"/>

---

---

经过Bootstrap使图片适配手机显示

 <img class="img-responsive" src="/statics/codecamp/images/running-cat.jpg">

经过Bootstrap使文本居中

<h2 class="red-text text-center">your text</h2>//能够使用空格给标签订义多个class

经过Bootstrap添加一个按钮

<button type="submit" class="btn btn-default">Like</button>

//btn-primary  /

 btn-success

 btn-info

btn-warning

btn-danger

 btn-link

添加一个Bootstrap块级元素按钮

btn-block

 text-danger

使用Bootstrap作页面布局

<div class="row">//标签设置了row 这个class属性以后，按钮即可并列排列了。
<div class="col-xs-4">
<button class="btn btn-block btn-primary">Like</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-info">Info</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-danger">Delete</button>
</div>
</div>