其实，学习过程中，如果不应用的话很容易忘记，那就得从头开始再来一次，那样挺浪费时间。写个记录记一下今天学习了什么，知识点在网上是和充足的，在资源丰富的互联网时代，但是记录就是提醒自己曾经干过什么，解决过什么问题，用了什么。
在很多招聘中，都有会一些前端框架的熟练要求，所以，该复习的要复习，该学习的该学习。
1）注意 是id=container 而不是class
<div id="container"> <h1>the morning<small>good</small></h1></div> 2）<small></small>为副标题，注意放在标签<h1>之内。设定小文本 (设置为父文本的 85% 大小)，新闻栏目可以使用。 3）<mark></mark>带有背景色的强调 4）为了给段落添加强调文本，则可以添加 class="lead"，这将得到更大更粗、 行高更高的文本 5）<abbr title="World Wide Web">WWW</abbr>给www添加一个解释说明，www为一个缩写词语，title为解释文本。 6）<address> 标签，可以在网页上显示联系信息。（使用<br>换行） 7）引用名人名言<blockquote> 这是一个带有源标题的引用。 <small>Someone famous in <cite title="Source Title">Source Title</cite></small></blockquote>8）<ul class="list-inline">让无序列表的样式为 inline
9）移动设备优先是 Bootstrap 3 的最显著的变化
<img src="..." class="img-responsive" alt="响应式图像">img-responsive 让图片变得更加响应式10）避免跨浏览器的不一致，Bootstrap 使用Normalize.css来建立跨浏览器的一致性.
11）Bootstrap的网格系统：Bootstrap 包含了一个响应式的、移动设备优先的、不固定的网格系统，可以随着设备或视口大小的增加而适当地扩展到 12 列。它包含了用于简单的布局选项的预定义类，也包含了用于生成更多语义布局的功能强大的混合类。工作原理 ● 行必须放置在 .container class 内，以便获得适当的对齐（alignment）和内边距（padding）。 ● 使用行来创建列的水平组。 ● 内容应该放置在列内，且唯有列可以是行的直接子元素。 ● 预定义的网格类，比如 .row 和 .col-xs-4，可用于快速创建网格布局。LESS 混合类可用于更多语义布局。 ● 列通过内边距（padding）来创建列内容之间的间隙。该内边距是通过 .rows 上的外边距（margin）取负，表示第一列和最后一列的行偏移。 ● 网格系统是通过指定您想要横跨的十二个可用的列来创建的。例如，要创建三个相等的列，则使用三个 .col-xs-4。 12）媒体查询是针对于平板电脑、台式电。xs是超小设备，sm是平板电脑，md台式电脑，lg是太台式电脑@media (min-width: @screen-sm-min) { ... } @media (min-width: @screen-md-min) { ... } @media (min-width: @screen-lg-min) { ... }在小设备浏览时无法确定网格显示的位置，可以使用 .clearfix class和 响应式实用工具来解决
网格系统需要多练习、
13）Bootstrap显示代码
<code></code>单行使用<pre></pre>多行使用标签使用<>代替尖角符号14）表格，表格的class类好多，但是有个需要注意的是就是active和danger以及success和info是使用在<tr>标签中的。
<div class="table-responsive"> <table class="table">......... </table> </div>可以让表格水平滚动以适应小型设备（小于 768px）。当在大于 768px 宽的大型设备上查看时，将看不到任何的差别。 15）表单表单有垂直，内联，水平三种。 垂直或者基本表单：<form role="form"></form>内联：<form class="form-inline" role="form"></>水平：<form class="form-horizontal" role="form"></>对一系列复选框和单选框使用 .checkbox-inline 或 .radio-inline class，控制它们显示在同一行上。
表单帮助文本（可以用作注释用）<span class="help-block">一个较长的帮助文本块，超过一行，需要扩展到下一行</span> 16）按钮按钮样式用于a，input，button任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观 17）图片样式.img-rounded：添加 border-radius:6px 来获得图片圆角。.img-circle：添加 border-radius:50% 来让整个图片变成圆形。.img-thumbnail：添加一些内边距（padding）和一个灰色的边框。 18）清除浮动 clearfix 19）下拉列表框的表示小三角形箭头 caret<label>下拉列表框<span class="caret"></span></label>