bootstrap基础（一）

文本

<small>本行内容是在标签内</small><br><strong>本行内容是在标签内</strong><br><em>本行内容是在标签内，并呈现为斜体</em><br><p class="text-left">向左对齐文本</p><p class="text-center">居中对齐文本</p><p class="text-right">向右对齐文本</p><p class="text-muted">本行内容是减弱的</p><p class="text-primary">本行内容带有一个 primary class</p><p class="text-success">本行内容带有一个 success class</p><p class="text-info">本行内容带有一个 info class</p><p class="text-warning">本行内容带有一个 warning class</p><p class="text-danger">本行内容带有一个 danger class</p>

字体图标

http://v3.bootcss.com/components/

<button type="button" class="btn btn-success btn-lg">    <span class="glyphicon glyphicon-home"></span> Home</button><button type="button" class="btn btn-info btn-sm">    <span class="glyphicon glyphicon-ok"></span> OK</button><button type="button" class="btn btn-danger btn-xs">    <span class="glyphicon glyphicon-star"></span> Star</button>

下拉菜单（Dropdowns）

<div class="dropdown">    <button type="button" class="btn dropdown-toggle" id="dropdownMenu1"             data-toggle="dropdown">        主题        <span class="caret"></span>    </button>    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">        <li role="presentation">            <a role="menuitem" tabindex="-1" href="#">Java</a>        </li>        <li role="presentation">            <a role="menuitem" tabindex="-1" href="#">数据挖掘</a>        </li>        <li role="presentation">            <a role="menuitem" tabindex="-1" href="#">数据通信/网络</a>        </li>        <li role="presentation" class="divider"></li>        <li role="presentation">            <a role="menuitem" tabindex="-1" href="#">分离的链接</a>        </li>    </ul></div>

控件组

<div class="input-group input-group-sm">    <span class="input-group-addon ">@</span><input type="text" class="form-control" >