css Twitter Bootstrap CSS类列表

Posted 2021-05-13

/*
 * Scaffolding
 * Basic and global styles for generating a grid system, structural layout, and page templates
 * ------------------------------------------------------------------------------------------- */

.container
Sets a width of 940px which also centres the content (clears floated elements before/after)

.container-fluid
Sets a minimum width of 940px (clears floated elements before/after)

.pull-right
Floats element to the right

.pull-left
Floats element to the left

.hide
sets element to display:none

.show
sets element to display:block

.row
Sets a -20px margin (clears floated elements before/after)

.span1 up to .span24
Sets specific pixel width values

.row > .offset1 (up to .offset12)
Sets specific margin-left values

.span-one-third
Sets width of 300px

.span-two-thirds
Sets width of 620px

.span-one-third
Sets margin-left of 340px (so clears .span-one-third by 40px)

.span-two-thirds
Sets margin-left of 660px (so clears .span-two-thirds by 40px)

/* Forms.less
 * Base styles for various input types, form layouts, and states
 * ------------------------------------------------------------- */

.uneditable-input
Sets element to block and gives border-radius + sets height/line-height to 18px + sets a box-shadow + background colour white + cursor: not-allowed

.input-mini
.mini
Sets width to 60px

.input-small
.small
Sets width to 90px

.input-medium
.medium
Sets width to 150px

.input-large
.large
Sets width to 210px

.input-xlarge
.xlarge
Sets width to 270px

.input-xxlarge
.xxlarge
Sets width to 530px

.span1 up to .span16 (when applied to inputs and textareas)
Sets specific pixel width values + no float + no left margin + inline-block

.actions
Sets top/bottom margin of 18px + padding + top border + border-radius

.actions .secondary-action
floats element right and <a> get a line-height of 30px

.help-inline
.help-block
line-height 18px + font-size: 13px

.form-stacked
padding-left: 20px;

/*
 * Tables.less
 * Tables for, you guessed it, tabular data
 * ---------------------------------------- */

.condensed-table
Applies smaller padding than default

.bordered-table
Applies borders to the table

.zebra-striped
Uses CSS3 to apply stripes (e.g. tr:nth-child(odd) td)

table .header
cursor:pointer

/* Patterns.less
 * Repeatable UI elements outside the base styles provided from the scaffolding
 * ---------------------------------------------------------------------------- */

.topbar
Sets height to 40px + position:fixed + to top/left of screen with a very large z-index (10,000)
Also sets styles on sub elements like a form, p, input, div > ul

.topbar-inner, .topbar .fill
Sets dark background gradient

.menu-dropdown
.dropdown-menu
Sets white background, floats to left, absolute positioning, box shadow, border-radius, large z-index (900) + min/max widths + display none!?
(I believe this is the drop down menu itself which is hidden until hovered over)

.breadcrumb
.pagination
Applies relevant styles to a <ul> element

.hero-unit 
Sets elements as a large promotional section

.page-header
Applies box-shadow and bottom-border

.btn.error
.btn.success
.btn.info
.btn
.btn.primary
.btn.active
.btn.disabled
.btn.large
.btn.small
.close
Different button styles

.well
Applies padding/background colours/border-radius/box-shadow