Bootstrap study note
Scaffolding
Two types of 960px/12column grids,
The default grid label is<div class="container">. Fixed 960px width.
The other is that the width of fluid grid is replaced by percentage instead of fixed width.
The difference between the two is fixed and not fixed (nonsense ). The default mesh is 960. If it exceeds 960, the size of the parent element is exceeded. The parent element of fluid grid expands its width and contains child elements.
. Container-fluid {
Padding-left: 20px;
Padding-Right: 20px;
}
. Container {
Margin-left: auto;
Margin-Right: auto;
Width: 940px;
}
This involves the differences between. Row and. Row-fluid of the child element Div:
. Row-fluid {
Width: 100%;
}
. Row {
Margin-left:-20px;
}
Clear: Both; clear floating.
Base CSS
-- Forms
Label class = "control-label" is only affected when forms class = "form-horizontal:
Float: left;
Padding-top: 5px;
Text-align: right;
Width: 140px;
The effect of Div class = "control" is: margin-left: 160px;
Div class = "control-group": clear: both;
The effect of Div class = "form-action" is:
Background-color: # f5f5f5;
Border-top: 1px solid # dddddddd;
Margin-bottom: 18px;
Margin-top: 18 P
Components
Alerts