Bootstrap

移动设备优先：

     呈现在不同设备上：若user-scalable=no   禁用缩放功能。

           <meta name="viewport"content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">

Bootstrap CSS 就是利用各种已申明或是定义的类进行调用

响应式图像：

<img src="..." class="img-responsive" alt="响应式图像">

容器：

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

.container {
   padding-right: 15px;
   padding-left: 15px;
   margin-right: auto;
   margin-left: auto;
}

基本的网格结构：

<div class="container">
   <div class="row">
      <div class="col-*-*"></div>
      <div class="col-*-*"></div>      
   </div>
   <div class="row">...</div>
</div>
<div class="container">....

缩写：

Bootstrap 定义 <abbr> 元素的样式为显示在文本底部的一条虚线边框，当鼠标悬停在上面时会显示完整的文本（只要您为 <abbr> title 属性添加了文本）。为了得到一个更小字体的文本，请添加 .initialism 到 <abbr>。

<abbr title="Real Simple Syndication" class="initialism">RSS</abbr>

引用（Blockquote）：

可以在任意的 HTML 文本旁使用默认的 <blockquote>。

Bootstrap 代码：

使用 <pre> 和 <code> 标签时，开始和结束标签使用了 unicode 变体： &lt; 和 &gt;。

<p><code>&lt;header&gt;</code> 作为内联元素被包围。</p> code作为内联显示代码

<p>如果需要把代码显示为一个独立的块元素，请使用 &lt;pre&gt; 标签：</p>

<pre> &lt;article&gt; pre把代码显示为一个独立的块

&lt;h1&gt;

Article Heading&lt;/h1&gt;

&lt;/article&gt;

</pre>

字体图标（Glyphicons）:就是根据地址和声明对字体或图标进行设置。

<span class="glyphicon glyphicon-search"></span>

下拉菜单：

<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>