1.标题
1级标题<h1> 38px 是默认大小的2.7倍2级标题<h2> 32px 是默认大小的2.25倍3级标题<h3> 24px 是默认大小的1.70倍4级标题<h4> 18px 是默认大小的1.25倍5级标题<h5> 14px 是默认大小的1.00倍6级标题<h6> 12px 是默认大小的0.85倍添加<small>标签会得到比标题字体更小的文本。<h1><small>这里会得到比h1更小的文本</small></h1>2.页面主体bootstrap定义了一个和其他段落有所区别的中心段落。要想创建一个中心段落,可以把lead类添加到段落中。<p class = "lead">这是一个中心段落。</p>3.排版元素强调内联元素、对齐、强调类、缩略语、地址、引用、列表3.1强调内联元素<strong>字体设置为粗体,文本比周围其他文本重要。<b>元素没有任何语义上的含义,只是粗体。<em>设置为斜体重点强调。注意与<i>的区分,<i>无语义上的含义。<mark>用于突出显示从其他地方引用过来的文本<u>为文本添加下划线<del>删除线3.2对齐类text-left:在其父级块元素中左对齐。与text-align:left效果一样。text-center:右对齐。text-right:居中。text-justify:类似Word排版中的文字两端对齐。3.3强调类text-muted:文本情景颜色设置为浅灰色。用来降低文本的重要性。text-warning:文本情景颜色设置为橙色。表示警告或出现错误。text-danger:文本情景颜色设置为红色。表示危险的动作、问题或很重要的错误。text-success:文本情景颜色设置为绿色。某个动作执行成功。text-info:文本情景颜色设置为蓝色。一般信息text-primary:文本情景颜色设置为天蓝色。表示文本具有一定的优先级。同样,有情景背景色。bg-primary\bg-success\bg-info\bg-warning\bg-danger3.4地址<address><a href = "mailto:1214443035@qq.com">Contact me</a></address>3.5引用将<p>元素放入<blockquote>来显示引用。在引用的的左侧加入了一条5像素长的浅灰色线。<blockquote><p>这一段是引用</p></blockquote>3.6缩略语<abbr>HTML</abbr>在缩略语的底部添加浅灰色的短线。有个title属性。有个辅助光标。3.7列表无序列表、有序列表、描述列表的外边距和内边距变的一直。<li> <ol> <dl>4.表格在<table>中添加class = “table”这个类。table-bordered#设置边框table-striped#设置斑马条纹为某个单元格添加情景颜色使用success、warning、danger、info、active类。5.按钮可以在<a>或<input>元素上使用button类<button type = "button" class = "btn btn-default"></button><button type = "button" class = "btn btn-primary"></button><button type = "button" class = "btn btn-success btn-lg"></button><button type = "button" class = "btn btn-info btn-sm"></button><button type = "button" class = "btn btn-waning btn-xs"></button><button type = "button" class = "btn btn-danger"></button><button type = "button" class = "btn btn-link"></button>6.表单正常、内联、水平<form role = "form"></form><form role = "form" class = "form-inline"></form> #相同元素的处于同一行中。<form role = "form" class = "form-horizontal"></form> #表单具有水平的布局7.代码<code>代码片段<code/>#将内联的代码片段包起来。如果有多个片段,就要使用<pre>标签。<code>标签中的尖括号必须要用<和>来代替。8.图片<img src = "1.png" class = "img-rounded" height = "150" width = "130">#方角<img src = "1.png" class = "img-circle">#圆角<img src = "1.png" class = "img-thumbnail" height = "75" width = "75">#缩略图还可以使用img-responsive类让图片成为响应式的。9.字体Bootstrap默认包含sans-serif、serif、monospace10.字体尺寸