Bootstrap CSS Layout list _javascript tips

This example for you to share the bootstrap CSS layout in the list layout for your reference, the specific content as follows

List
General List ul Li
Have sequence table ol Li
Go to the point list. list-unstyled
Inline list. list-inline
Definition list DL DT DD
Horizontal definition list Dl-horizontal

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

General List ul Li
Have sequence table ol Li
Go to the point list class= "list-unstyled"

Source code
. list-unstyled {
 padding-left:0;
 List-style:none;
}

Inline list class= "List-inline"

Source code
. list-inline {
 padding-left:0;
 Margin-left: -5px;
 List-style:none
}
. List-inline > li {
 display:inline-block;
 padding-right:5px;
 padding-left:5px;
}

Definition list DL DT DD

DL {
 margin-top:0;
 margin-bottom:20px;
}
DT,
DD {
 line-height:1.42857143;
}
DT {
 font-weight:bold;
}
dd {
 margin-left:0;
}

Horizontal definition list class= "Dl-horizontal"

@media (min-width:768px) {
 . dl-horizontal dt {
 float:left;
 width:160px;
 Overflow:hidden;
 Clear:left;
 Text-align:right;
 Displays the ellipsis to represent the trimmed text
 text-overflow:ellipsis;
 White-space:nowrap
 }
 . Dl-horizontal dd {
 margin-left:180px
 }}

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.