列表:
无序列表(列表中项目内容没有固定的顺序),
有序列表(通常使用在一组有前后顺序的内容上),
描述列表(定义解释一组词汇)
无序列表:
<ul>
<li>Ueditor编辑器</li>
<li>TinyMCE编辑器</li>
<li>Kindeditor编辑器</li>
</ul>
如图:
有序列表:
<ol>
<li>Ueditor编辑器</li>
<li>TinyMCE编辑器</li>
<li>Kindeditor编辑器</li>
</ol>
如图:
描述列表:
dt:要描述的词汇
dd:对这个词汇进行解释的句子
<dl>
<dt>Ueditor编辑器</dt>
<dd>Ueditor编辑器强大细致</dd>
<dt>TinyMCE编辑器</dt>
<dd>TinyMCE编辑器好像还不错</dd>
<dt>Kindeditor编辑器</dt>
<dd>Kindeditor编辑器非常好用</dd>
</dl>
如图:
BS为描述列表提供了类来更改描述列表的样式:
这里的样式应该是水平对齐,为什么这里没有水平对齐,找到bootstrap.css!!!
源文件中的
.dl-horizontal dt {
float: left;
clear: left;
width: 120px;
text-align: right;
}
.dl-horizontal dd {
margin-left: 130px;//这里的130px表示dd距离dt相差10个像素
}
不用修改源码,只需要在新的css文件或者页面style标签中重新定义.dl-horizontal dd的样式为:
.dl-horizontal dd {
margin-left: 10px;
float:left;
}
修改完成后,得到如图所示效果:
这个效果就正常了!(但我还是不确定,是不是这么修改...)
本人这里如果有问题,请留言,谢谢先。