通过自定义 Bootstrap 组件、Less 变量和 jQuery 插件,定制一份属于你自己的 Bootstrap 版本吧。
@brand-primary
有现成的配置?上传并导入你的 config.json 文件。
config.json
将文件拖拽到这里或手动上传。
没有现成的配置文件?没关系,从下面开始自定义各字段吧。
选择将哪些 Less 文件编译到你自己的定制 Bootstrap 版本中。不确定每个文件的用途吗?请先通读此文档中的全局 CSS 样式和组件章节。
选择将那些 jQuery 插件包含到你的定制版本中。不确定他们的用途吗?请通读此文档中的 JavaScript 插件章节。
所有选中的插件都将会编译为一份是和阅读的版本 bootstrap.js 和一份压缩版本 bootstrap.min.js。我们建议将压缩版本用于生产环境。
bootstrap.js
bootstrap.min.js
所有插件都依赖最新版本的 jQuery,因此,必须首先将 jQuery 引入页面。
通过 Less 变量可以自定义颜色、尺寸等,最终将会反映到你所下载的 CSS 样式表文件中。
Gray and brand colors for use across Bootstrap.
Settings for some of the most global styles.
Background color for <body>.
<body>
Global text color on <body>.
Global textual link color.
Link hover color set via darken() function.
darken()
Link hover decoration.
Font, line-height, and color for body text, headings, and more.
Default monospace fonts for <code>, <kbd>, and <pre>.
<code>
<kbd>
<pre>
Unit-less line-height for use in components like buttons.
line-height
Computed "line-height" (font-size * line-height) for use with margin, padding, etc.
font-size
margin
padding
By default, this inherits from the <body>.
Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
Load fonts from this directory.
File name for all font files.
Element ID within SVG icon file.
Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
Global color for active items (e.g., navs or dropdowns).
Global background color for active items (e.g., navs or dropdowns).
Width of the border for generating carets that indicator dropdowns.
border
Carets increase slightly in size for larger components.
Customizes the .table component with basic values, each used across all table variations.
.table
Padding for <th>s and <td>s.
<th>
<td>
Padding for cells in .table-condensed.
.table-condensed
Default background color used for all tables.
Background color used for .table-striped.
.table-striped
Background color used for .table-hover.
.table-hover
Border color for table and cell borders.
For each of Bootstrap's buttons, define text, background and border color.
<input> background color
<input>
<input disabled> background color
<input disabled>
Text color for <input>s
<input> border color
Default .form-control border radius
.form-control
Large .form-control border radius
Small .form-control border radius
Border color for inputs on focus
Placeholder text color
Default .form-control height
Large .form-control height
Small .form-control height
.form-group margin
.form-group
Background color for textual input addons
Border color for textual input addons
Disabled cursor for form controls and buttons.
Dropdown menu container and contents.
Background for the dropdown menu.
Dropdown menu border-color.
border-color
Dropdown menu border-color for IE8.
Divider color for between dropdown items.
Dropdown link text color.
Hover color for dropdown links.
Hover background for dropdown links.
Active dropdown menu item text color.
Active dropdown menu item background color.
Disabled dropdown menu item background color.
Text color for headers within dropdown menus.
Deprecated @dropdown-caret-color as of v3.1.0
@dropdown-caret-color
Define the breakpoints at which your layout will change, adapting to different screen sizes.
Deprecated @screen-xs as of v3.0.1
@screen-xs
Deprecated @screen-xs-min as of v3.2.0
@screen-xs-min
Deprecated @screen-phone as of v3.0.1
@screen-phone
Deprecated @screen-sm as of v3.0.1
@screen-sm
Deprecated @screen-tablet as of v3.0.1
@screen-tablet
Deprecated @screen-md as of v3.0.1
@screen-md
Deprecated @screen-desktop as of v3.0.1
@screen-desktop
Deprecated @screen-lg as of v3.0.1
@screen-lg
Deprecated @screen-lg-desktop as of v3.0.1
@screen-lg-desktop
Define your custom responsive grid.
Number of columns in the grid.
Padding between columns. Gets divided in half for the left and right.
Point at which the navbar becomes uncollapsed.
Point at which the navbar begins collapsing.
Define the maximum width of .container for different screen sizes.
.container
For @screen-sm-min and up.
@screen-sm-min
For @screen-md-min and up.
@screen-md-min
For @screen-lg-min and up.
@screen-lg-min
Define colors for form feedback states and, by default, alerts.
Tooltip max width
Tooltip text color
Tooltip background color
Tooltip arrow width
Tooltip arrow color
Popover body background color
Popover maximum width
Popover border color
Popover fallback border color
Popover title background color
Popover arrow width
Popover arrow color
Popover outer arrow width
Popover outer arrow color
Popover outer arrow fallback color
Default label background color
Primary label background color
Success label background color
Info label background color
Warning label background color
Danger label background color
Default label text color
Default text color of a linked label
Padding applied to the modal body
Padding applied to the modal title
Modal title line-height
Background color of modal content area
Modal content border color
Modal content border color for IE8
Modal backdrop background color
Modal backdrop opacity
Modal header border color
Modal footer border color
Define alert colors, border radius, and padding.
Background color of the whole progress component
Progress bar text color
Variable for setting rounded corners on progress bar.
Default progress bar color
Success progress bar color
Warning progress bar color
Danger progress bar color
Info progress bar color
Background color on .list-group-item
.list-group-item
.list-group-item border color
List group border radius
Background color of single list items on hover
Text color of active list items
Background color of active list items
Border color of active list elements
Text color for content within active list items
Text color of disabled list items
Background color of disabled list items
Text color for content within disabled list items
Border color for elements within panels
Padding around the thumbnail image
Thumbnail background color
Thumbnail border color
Thumbnail border radius
Custom text color for thumbnail captions
Padding around the thumbnail caption
Linked badge text color on hover
Badge text color in active nav link
Badge background color in active nav link
Breadcrumb background color
Breadcrumb text color
Text color of current page in the breadcrumb
Textual separator for between breadcrumb elements
Horizontal offset for forms and lists.
Text muted color
Abbreviations and acronyms border color
Headings small color
Blockquote small color
Blockquote font size
Blockquote border color
Page header border color
Width of horizontal description list titles
Horizontal line color.
庆祝一下!你的定制版 Bootstrap 即将大功告成。只要点击下面的按钮就可以下载了。
Submit feedback about this site to: