Tùy chỉnh và tải về Bootstrap

Tùy chỉnh các biến trong Less để xác định màu sắc, kích thước và các thuộc tính khác bên trong CSS của bạn.

Màu sắc

Các màu sắc xám và màu sắc cho brand được sử dụng phổ biến trong Bootstrap.

@gray-darker

@gray-dark

@gray

@gray-light

@gray-lighter

@brand-primary

@brand-success

@brand-info

@brand-warning

@brand-danger

Scaffolding

Thiết lập một số style phổ biến nhất.

@body-bg

Background color for <body>.

@text-color

Global text color on <body>.

@link-color

Global textual link color.

@link-hover-color

Link hover color set via darken() function.

Typography

Font chữ, chiều cao của dòng, màu sắc của text trong body, tiêu đề và còn hơn thế nữa.

@font-family-sans-serif

@font-family-serif

@font-family-monospace

Default monospace fonts for <code>, <kbd>, and <pre>.

@font-family-base

@font-size-base

@font-size-large

@font-size-small

@font-size-h1

@font-size-h2

@font-size-h3

@font-size-h4

@font-size-h5

@font-size-h6

@line-height-base

Unit-less line-height for use in components like buttons.

@line-height-computed

Computed "line-height" (font-size * line-height) for use with margin, padding, etc.

@headings-font-family

By default, this inherits from the <body>.

@headings-font-weight

@headings-line-height

@headings-color

Iconography

Xác định đường dẫn lưu trữ và tên tập tin của các font biểu tượng Glyphicons. Rất hữu ích cho những ai tích hợp Bootstrap bằng Bower.

@icon-font-path

Load fonts from this directory.

@icon-font-name

File name for all font files.

@icon-font-svg-id

Element ID within SVG icon file.

Các thành phần

Xác định giá trị padding chung, border-radius và nhiều hơn thế nữa. Giá trị được xác định dựa trên font-size bằng 14px và line-height bằng 1.428(bắt đầu với ~20px).

@padding-base-vertical

@padding-base-horizontal

@padding-large-vertical

@padding-large-horizontal

@padding-small-vertical

@padding-small-horizontal

@padding-xs-vertical

@padding-xs-horizontal

@line-height-large

@line-height-small

@border-radius-base

@border-radius-large

@border-radius-small

@component-active-color

Global color for active items (e.g., navs or dropdowns).

@component-active-bg

Global background color for active items (e.g., navs or dropdowns).

@caret-width-base

Width of the border for generating carets that indicator dropdowns.

@caret-width-large

Carets increase slightly in size for larger components.

Bảng

Tùy biến thành phần .table bằng một số giá trị cơ bản, tương ứng với các biến thể của bảng.

@table-cell-padding

Padding for <th>s and <td>s.

@table-condensed-cell-padding

Padding for cells in .table-condensed.

@table-bg

Default background color used for all tables.

@table-bg-accent

Background color used for .table-striped.

@table-bg-hover

Background color used for .table-hover.

@table-bg-active

@table-border-color

Border color for table and cell borders.

Nút

Dành cho nút trong 's để xác định text, màu nền và màu đường viền.

@btn-font-weight

@btn-default-color

@btn-default-bg

@btn-default-border

@btn-primary-color

@btn-primary-bg

@btn-primary-border

@btn-success-color

@btn-success-bg

@btn-success-border

@btn-info-color

@btn-info-bg

@btn-info-border

@btn-warning-color

@btn-warning-bg

@btn-warning-border

@btn-danger-color

@btn-danger-bg

@btn-danger-border

@btn-link-disabled-color

Form

@input-bg

<input> background color

@input-bg-disabled

<input disabled> background color

@input-color

Text color for <input>s

@input-border

<input> border color

@input-border-radius

<input> border radius

@input-border-focus

Border color for inputs on focus

@input-color-placeholder

Placeholder text color

@input-height-base

Default .form-control height

@input-height-large

Large .form-control height

@input-height-small

Small .form-control height

@legend-color

@legend-border-color

@input-group-addon-bg

Background color for textual input addons

@input-group-addon-border-color

Border color for textual input addons

Menu sổ xuống

Container chứa menu sổ xuống và nội dung của nó.

@dropdown-bg

Background for the dropdown menu.

@dropdown-border

Dropdown menu border-color.

@dropdown-fallback-border

Dropdown menu border-color for IE8.

@dropdown-divider-bg

Divider color for between dropdown items.

@dropdown-link-color

Dropdown link text color.

@dropdown-link-hover-color

Hover color for dropdown links.

@dropdown-link-hover-bg

Hover background for dropdown links.

@dropdown-link-active-color

Active dropdown menu item text color.

@dropdown-link-active-bg

Active dropdown menu item background color.

@dropdown-link-disabled-color

Disabled dropdown menu item background color.

@dropdown-header-color

Text color for headers within dropdown menus.

@dropdown-caret-color

Deprecated @dropdown-caret-color as of v3.1.0

Các mốc media queries

Xác định điểm mốc mà tại đó bố cục sẽ thay đổi, tương thích với các kích thước màn hình khác nhau.

@screen-xs

Deprecated @screen-xs as of v3.0.1

@screen-xs-min

Deprecated @screen-xs-min as of v3.2.0

@screen-phone

Deprecated @screen-phone as of v3.0.1

@screen-sm

Deprecated @screen-sm as of v3.0.1

@screen-sm-min

@screen-tablet

Deprecated @screen-tablet as of v3.0.1

@screen-md

Deprecated @screen-md as of v3.0.1

@screen-md-min

@screen-desktop

Deprecated @screen-desktop as of v3.0.1

@screen-lg

Deprecated @screen-lg as of v3.0.1

@screen-lg-min

@screen-lg-desktop

Deprecated @screen-lg-desktop as of v3.0.1

@screen-xs-max

@screen-sm-max

@screen-md-max

Hệ thống lưới

Tùy biến lưới responsive của bạn.

@grid-columns

Number of columns in the grid.

@grid-gutter-width

Padding between columns. Gets divided in half for the left and right.

@grid-float-breakpoint

Point at which the navbar becomes uncollapsed.

@grid-float-breakpoint-max

Point at which the navbar begins collapsing.

Kích thước của container

Xác định chiều rộng tối đa của .container đối với các kích thước màn hình khác nhau.

@container-tablet

@container-sm

For @screen-sm-min and up.

@container-desktop

@container-md

For @screen-md-min and up.

@container-large-desktop

@container-lg

For @screen-lg-min and up.

@navbar-height

@navbar-margin-bottom

@navbar-border-radius

@navbar-padding-horizontal

@navbar-padding-vertical

@navbar-collapse-max-height

@navbar-default-color

@navbar-default-bg

@navbar-default-border

@navbar-default-link-color

@navbar-default-link-hover-color

@navbar-default-link-hover-bg

@navbar-default-link-active-color

@navbar-default-link-active-bg

@navbar-default-link-disabled-color

@navbar-default-link-disabled-bg

@navbar-default-brand-color

@navbar-default-brand-hover-color

@navbar-default-brand-hover-bg

@navbar-default-toggle-hover-bg

@navbar-default-toggle-icon-bar-bg

@navbar-default-toggle-border-color

@navbar-inverse-color

@navbar-inverse-bg

@navbar-inverse-border

@navbar-inverse-link-color

@navbar-inverse-link-hover-color

@navbar-inverse-link-hover-bg

@navbar-inverse-link-active-color

@navbar-inverse-link-active-bg

@navbar-inverse-link-disabled-color

@navbar-inverse-link-disabled-bg

@navbar-inverse-brand-color

@navbar-inverse-brand-hover-color

@navbar-inverse-brand-hover-bg

@navbar-inverse-toggle-hover-bg

@navbar-inverse-toggle-icon-bar-bg

@navbar-inverse-toggle-border-color

Các thành phần điều hướng

Style dùng chung cho các thành phần điều hướng

@nav-link-padding

@nav-link-hover-bg

@nav-disabled-link-color

@nav-disabled-link-hover-color

@nav-open-link-hover-color

Thành phần điều hướng dạng thẻ

@nav-tabs-border-color

@nav-tabs-link-hover-border-color

@nav-tabs-active-link-hover-bg

@nav-tabs-active-link-hover-color

@nav-tabs-active-link-hover-border-color

@nav-tabs-justified-link-border-color

@nav-tabs-justified-active-link-border-color

Thành phần điều hướng dạng viên thuốc

@nav-pills-border-radius

@nav-pills-active-link-hover-bg

@nav-pills-active-link-hover-color

Phân trang

@pagination-color

@pagination-bg

@pagination-border

@pagination-hover-color

@pagination-hover-bg

@pagination-hover-border

@pagination-active-color

@pagination-active-bg

@pagination-active-border

@pagination-disabled-color

@pagination-disabled-bg

@pagination-disabled-border

@pager-bg

@pager-border

@pager-border-radius

@pager-hover-bg

@pager-active-bg

@pager-active-color

@pager-disabled-color

Jumbotron

@jumbotron-padding

@jumbotron-color

@jumbotron-bg

@jumbotron-heading-color

@jumbotron-font-size

Các trạng thái của form và tin nhắn thông báo

Xác định màu sắc cho các trạng thái phản hồi của form và các tin nhắn thông báo.

@state-success-text

@state-success-bg

@state-success-border

@state-info-text

@state-info-bg

@state-info-border

@state-warning-text

@state-warning-bg

@state-warning-border

@state-danger-text

@state-danger-bg

@state-danger-border

Chú thích

@tooltip-max-width

Tooltip max width

@tooltip-color

Tooltip text color

@tooltip-bg

Tooltip background color

@tooltip-opacity

@tooltip-arrow-width

Tooltip arrow width

@tooltip-arrow-color

Tooltip arrow color

Popover

@popover-bg

Popover body background color

@popover-max-width

Popover maximum width

@popover-border-color

Popover border color

@popover-fallback-border-color

Popover fallback border color

@popover-title-bg

Popover title background color

@popover-arrow-width

Popover arrow width

@popover-arrow-color

Popover arrow color

@popover-arrow-outer-width

Popover outer arrow width

@popover-arrow-outer-color

Popover outer arrow color

@popover-arrow-outer-fallback-color

Popover outer arrow fallback color

Nhãn

@label-default-bg

Default label background color

@label-primary-bg

Primary label background color

@label-success-bg

Success label background color

@label-info-bg

Info label background color

@label-warning-bg

Warning label background color

@label-danger-bg

Danger label background color

@label-color

Default label text color

@label-link-hover-color

Default text color of a linked label

Modal

@modal-inner-padding

Padding applied to the modal body

@modal-title-padding

Padding applied to the modal title

@modal-title-line-height

Modal title line-height

@modal-content-bg

Background color of modal content area

@modal-content-border-color

Modal content border color

@modal-content-fallback-border-color

Modal content border color for IE8

@modal-backdrop-bg

Modal backdrop background color

@modal-backdrop-opacity

Modal backdrop opacity

@modal-header-border-color

Modal header border color

@modal-footer-border-color

Modal footer border color

@modal-lg

@modal-md

@modal-sm

Tin nhắn thông báo

Xác định màu sắc, giá trị padding và border-radius của các tin nhắn thông báo.

@alert-padding

@alert-border-radius

@alert-link-font-weight

@alert-success-bg

@alert-success-text

@alert-success-border

@alert-info-bg

@alert-info-text

@alert-info-border

@alert-warning-bg

@alert-warning-text

@alert-warning-border

@alert-danger-bg

@alert-danger-text

@alert-danger-border

Thanh tiến trình

@progress-bg

Background color of the whole progress component

@progress-bar-color

Progress bar text color

@progress-bar-bg

Default progress bar color

@progress-bar-success-bg

Success progress bar color

@progress-bar-warning-bg

Warning progress bar color

@progress-bar-danger-bg

Danger progress bar color

@progress-bar-info-bg

Info progress bar color

Nhóm danh sách

@list-group-bg

Background color on .list-group-item

@list-group-border

.list-group-item border color

@list-group-border-radius

List group border radius

@list-group-hover-bg

Background color of single list items on hover

@list-group-active-color

Text color of active list items

@list-group-active-bg

Background color of active list items

@list-group-active-border

Border color of active list elements

@list-group-active-text-color

Text color for content within active list items

@list-group-disabled-color

Text color of disabled list items

@list-group-disabled-bg

Background color of disabled list items

@list-group-disabled-text-color

Text color for content within disabled list items

@list-group-link-color

@list-group-link-hover-color

@list-group-link-heading-color

Panel

@panel-bg

@panel-body-padding

@panel-heading-padding

@panel-footer-padding

@panel-border-radius

@panel-inner-border

Border color for elements within panels

@panel-footer-bg

@panel-default-text

@panel-default-border

@panel-default-heading-bg

@panel-primary-text

@panel-primary-border

@panel-primary-heading-bg

@panel-success-text

@panel-success-border

@panel-success-heading-bg

@panel-info-text

@panel-info-border

@panel-info-heading-bg

@panel-warning-text

@panel-warning-border

@panel-warning-heading-bg

@panel-danger-text

@panel-danger-border

@panel-danger-heading-bg

Thumbnail

@thumbnail-padding

Padding around the thumbnail image

@thumbnail-bg

Thumbnail background color

@thumbnail-border

Thumbnail border color

@thumbnail-border-radius

Thumbnail border radius

@thumbnail-caption-color

Custom text color for thumbnail captions

@thumbnail-caption-padding

Padding around the thumbnail caption

Well

@well-bg

@well-border

Badge

@badge-color

@badge-link-hover-color

Linked badge text color on hover

@badge-bg

@badge-active-color

Badge text color in active nav link

@badge-active-bg

Badge background color in active nav link

@badge-font-weight

@badge-border-radius

Breadcrumb

@breadcrumb-padding-vertical

@breadcrumb-padding-horizontal

@breadcrumb-bg

Breadcrumb background color

@breadcrumb-color

Breadcrumb text color

@breadcrumb-active-color

Text color of current page in the breadcrumb

@breadcrumb-separator

Textual separator for between breadcrumb elements

Carousel

@carousel-text-shadow

@carousel-control-color

@carousel-control-width

@carousel-control-opacity

@carousel-control-font-size

@carousel-indicator-active-bg

@carousel-indicator-border-color

@carousel-caption-color

Close

@close-font-weight

@close-color

@close-text-shadow

Code

@code-color

@code-bg

@kbd-color

@kbd-bg

@pre-bg

@pre-color

@pre-border-color

@pre-scrollable-max-height

Type

@text-muted

Màu sắc của text thông thường

@abbr-border-color

Màu sắc đường viền của tên viết tắt

@headings-small-color

Màu sắc của phần chữ nhỏ trong tiêu đề

@blockquote-small-color

Màu sắc của phần chữ nhỏ trong blockquote

@blockquote-font-size

Kích thước font chữ của blockquote

@blockquote-border-color

Màu sắc đường viền của blockquote

@page-header-border-color

Màu sắc đường viền của phần tiêu đề trang

Khác

@hr-border

Màu sắc của đường kẻ ngang.

@component-offset-horizontal

Độ lệch theo hàng ngang đối với form và danh sách.

Hoan hô! Phiên bản tùy chỉnh Bootstrap của bạn đã sẵn sàng được biên dịch. Chỉ cần nhấp vào nút bên dưới để hoàn tất quá trình này.

Tùy chỉnh và tải về

Các tập tin Less

CSS phổ biến

Các thành phần

Các thành phần Javascript

Các plugin jQuery

Liên kết với các thành phần

Magic

Hai tập tin

Yêu cầu jQuery

Các biến số Less

Màu sắc

Scaffolding

Typography

Iconography

Các thành phần

Bảng

Nút

Form

Menu sổ xuống

Các mốc media queries

Hệ thống lưới

Kích thước của container

Thanh điều hướng

Các thành phần điều hướng

Style dùng chung cho các thành phần điều hướng

Thành phần điều hướng dạng thẻ

Thành phần điều hướng dạng viên thuốc

Phân trang

Pager

Jumbotron

Các trạng thái của form và tin nhắn thông báo

Chú thích

Popover

Nhãn

Modal

Tin nhắn thông báo

Thanh tiến trình

Nhóm danh sách

Panel

Thumbnail

Well

Badge

Breadcrumb

Carousel

Close

Code

Type

Khác

Tải về