BootStrap排版 常用属性

5.排版

5.1 标题

h1到h6正常使用，并且提供了.h1到.h6类，为的是给内联（inline）属性的文本赋予标题的样式。

副标题可以使用标签或者.small类来设置副标题。

5.2 中心内容

通过.lead让段落突出显示

5.3 对齐

可以使用style的text-algin，也可以使用bootstrap提供的4个类

.text-left 文本左对齐

.text-right 文本右对齐

.text-center 文本居中

.text-justify 文本两端对齐

5.4 强调

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

其实就是给文本加颜色。

5.5 列表

我们有一个无序列表

<ul class="list">

<li>html</li>

<li>css</li>

<li>js</li>

</ul>

BootStrap给我们提供了一些类

.list-unstyled去除无序列表前面的点，和浮动，相当于原生js里面的

.list{

list-style: none;

margin: 0;

padding: 0;

}

.list-inline把垂直列表变为水平，并且把点去掉，去除浮动

定义列表

<dl class="">

<dt>前端</dt>

<dd>Html，css，js</dd>

<dt>框架</dt>

<dd>Vue，jquery,BootStrap</dd>

</dl>

.dl-horizontal把定义的列表变为水平

<dl class="dl-horizontal">

<dt>前端</dt>

<dd>Html，css，js</dd>

<dt>框架</dt>

<dd>Vue，jquery,BootStrap</dd>

</dl>