常州小菜园微信小程序_Bootstrap CSS布局之列表

Bootstrap CSS布局之列表       这篇文章主要为大家详细介绍了Bootstrap CSS布局之列表的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了Bootstrap CSS布局中的列表布局,供大家参考,具体内容如下

列表
普通列表ul li
有序列表ol li
去点列表.list-unstyled
内联列表.list-inline
定义列表dl dt dd
水平定义列表dl-horizontal

 margin-top: 0;
 margin-bottom: 10px;
ul ul,
ol ul,
ul ol,
ol ol {
 margin-bottom: 0;
}

普通列表ul li
有序列表ol li
去点列表 >

.list-unstyled {
 padding-left: 0;
 list-style: none;

内联列表 >

.list-inline {
 padding-left: 0;
 margin-left: -5px;
 list-style: none;
.list-inline li {
 display: inline-block;
 padding-right: 5px;
 padding-left: 5px;

定义列表dl dt dd

 margin-top: 0;
 margin-bottom: 20px;
 line-height: 1.;
 font-weight: bold;
 margin-left: 0;

水平定义列表 >

@media (min-width: 768px) {
 .dl-horizontal dt {
 float: left;
 width: 160px;
 overflow: hidden;
 clear: left;
 text-align: right;
 //显示省略符号来代表被修剪的文本
 text-overflow: elli凡科抠图is;
 white-space: nowrap;
 .dl-horizontal dd {
 margin-left: 180px;

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持凡科。

相关阅读