2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-05-30 15:24:08 +03:00

add markdown toc stuff

This commit is contained in:
Mark Otto
2015-05-29 01:58:52 -07:00
parent 9e1af0d743
commit b455ed8def
35 changed files with 216 additions and 55 deletions
+11 -6
View File
@@ -5,7 +5,12 @@ title: Compiling
Bootstrap uses [Grunt](http://gruntjs.com) for its build system, with convenient methods for working with the framework. It's how we compile our code, run tests, and more.
### Install Grunt
## Contents
* Will be replaced with the ToC, excluding the "Contents" header
{:toc}
## Install Grunt
**To install Grunt, you must first [download and install node.js](http://nodejs.org/download/)** (which includes npm). npm stands for [node packaged modules](http://npmjs.com/) and is a way to manage development dependencies through node.js.
@@ -22,7 +27,7 @@ When completed, you'll be able to run the various Grunt commands provided from t
[install-ruby]: https://www.ruby-lang.org/en/documentation/installation/
[gembundler]: http://bundler.io/
### Available Grunt commands
## Available Grunt commands
| Task | Description |
| --- | --- |
@@ -32,9 +37,9 @@ When completed, you'll be able to run the various Grunt commands provided from t
| `grunt docs` | Builds and tests CSS, JavaScript, and other assets which are used when running the documentation locally via `jekyll serve`. |
| `grunt watch` | This is a convenience method for watching just Sass files and automatically building them whenever you save. |
### Use another Sass compiler
Bootstrap is compiled with [libsass][libsass] by default.
Use another compiler by setting the `TWBS_SASS` environment variable to:
## Use another Sass compiler
Bootstrap is compiled with [libsass][libsass] by default. Use another compiler by setting the `TWBS_SASS` environment variable to:
* `sass` to use [Ruby Sass][ruby-sass] via [grunt-contrib-sass][grunt-contrib-sass].
* `libsass` (default) to use [libsass][libsass] via [grunt-sass][grunt-sass].
@@ -46,6 +51,6 @@ For example, run `TWBS_SASS=sass grunt` to test and build Bootstrap with Ruby Sa
[libsass]: https://github.com/sass/libsass
[grunt-sass]: https://github.com/sindresorhus/grunt-sass
### Troubleshooting dependencies
## Troubleshooting dependencies
Should you encounter problems with installing dependencies or running Grunt commands, uninstall all previous dependency versions (global and local). Then, rerun `npm install`.
+7 -2
View File
@@ -11,7 +11,12 @@ Bootstrap can come in one of two forms, as precompiled or source code. Learn mor
Please note that **all JavaScript plugins require jQuery** to be included, as shown in the [starter template](../quick-start). [Consult our `bower.json`]({{ site.repo }}/blob/v{{ site.current_version }}/bower.json) to see which versions of jQuery are supported.
{% endcallout %}
### Precompiled Bootstrap
## Contents
* Will be replaced with the ToC, excluding the "Contents" header
{:toc}
## Precompiled Bootstrap
Once downloaded, unzip the compressed folder to see the structure of (the compiled) Bootstrap. You'll see something like this:
@@ -30,7 +35,7 @@ bootstrap/
This is the most basic form of Bootstrap: precompiled files for quick drop-in usage in nearly any web project. We provide compiled CSS and JS (`bootstrap.*`), as well as compiled and minified CSS and JS (`bootstrap.min.*`). CSS [source maps](https://developers.google.com/chrome-developer-tools/docs/css-preprocessors) (`bootstrap.*.map`) are available for use with certain browsers' developer tools.
### Bootstrap source code
## Bootstrap source code
The Bootstrap source code download includes the precompiled CSS and JavaScript assets, along with source Sass, JavaScript, and documentation. More specifically, it includes the following and more:
+12 -8
View File
@@ -5,6 +5,11 @@ title: Download
Bootstrap is available for download via ZIP file in two flavors: precompiled CSS and Javascript, and the complete source code with documentation.
## Contents
* Will be replaced with the ToC, excluding the "Contents" header
{:toc}
{% comment %}
## Optional builds
@@ -23,25 +28,25 @@ Download the entire project and quickly get developing. Includes all CSS and Jav
---
{% endcomment %}
### Precompiled
## Precompiled
Compiled and minified CSS and JavaScript. No docs or original source files are included.
<a href="{{ site.download.dist }}" class="btn btn-lg btn-outline" role="button" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download compiled');">Download Bootstrap</a>
### Download source and docs
## Download source and docs
Source Sass, JavaScript, and documentation. **Requires a Sass compiler and [some setup](../compiling).**
<a href="{{ site.download.source }}" class="btn btn-lg btn-outline" role="button" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download source');">Download source</a>
### Bower
## Bower
You can also install and manage Bootstrap's Sass, CSS, and JavaScript using [Bower](http://bower.io).
{% highlight bash %}$ bower install bootstrap{% endhighlight %}
### npm
## npm
Bootstrap is available as [an npm package](https://www.npmjs.org/package/bootstrap). Install it into your Node powered apps with:
@@ -54,19 +59,18 @@ Bootstrap's `package.json` contains some additional metadata under the following
- `less` - path to Bootstrap's main [Less](http://lesscss.org) source file
- `style` - path to Bootstrap's non-minified CSS that's been precompiled using the default settings (no customization)
### Meteor
## Meteor
{% highlight bash %}
$ meteor add twbs:bootstrap
{% endhighlight %}
### Composer
## Composer
{% highlight bash %}
$ composer require twbs/bootstrap
{% endhighlight %}
### Autoprefixer required
## Autoprefixer required
Bootstrap uses [Autoprefixer](https://github.com/postcss/autoprefixer) to deal with [CSS vendor prefixes](http://webdesign.about.com/od/css/a/css-vendor-prefixes.htm). If you're compiling Bootstrap from its source Sass and not using our Gruntfile, you'll need to integrate Autoprefixer into your build process yourself. If you're using precompiled Bootstrap or using our Gruntfile, you don't need to worry about this as Autoprefixer is already integrated into our Gruntfile.
+14 -9
View File
@@ -5,15 +5,20 @@ title: JavaScript
Bootstrap includes a handful of JavaScript to help bring some of our components to life. Learn more about how to include it, our data and programmatic API options, and more.
### Individual or compiled
## Contents
* Will be replaced with the ToC, excluding the "Contents" header
{:toc}
## Individual or compiled
Plugins can be included individually (using Bootstrap's individual `*.js` files), or all at once using `bootstrap.js` or the minified `bootstrap.min.js` (don't include both).
### Dependencies
## Dependencies
Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs. Also note that all plugins depend on jQuery (this means jQuery must be included **before** the plugin files). [Consult our `bower.json`]({{ site.repo }}/blob/v{{ site.current_version }}/bower.json) to see which versions of jQuery are supported.
### Data attributes
## Data attributes
Nearly all Bootstrap plugins can be enabled and configured through HTML alone with data attributes (our preferred way of using JavaScript functionality). Be sure to **only use one set of data attributes on a single element** (e.g., you cannot trigger a tooltip and modal from the same button.)
@@ -29,7 +34,7 @@ Alternatively, to target a specific plugin, just include the plugin's name as a
$(document).off('.alert.data-api')
{% endhighlight %}
### Programmatic API
## Programmatic API
We also believe you should be able to use all Bootstrap plugins purely through the JavaScript API. All public APIs are single, chainable methods, and return the collection acted upon.
@@ -47,14 +52,14 @@ $('#myModal').modal('show') // initializes and invokes show immed
Each plugin also exposes its raw constructor on a `Constructor` property: `$.fn.popover.Constructor`. If you'd like to get a particular plugin instance, retrieve it directly from an element: `$('[rel="popover"]').data('popover')`.
#### Default settings
### Default settings
You can change the default settings for a plugin by modifying the plugin's `Constructor.DEFAULTS` object:
{% highlight js %}
$.fn.modal.Constructor.DEFAULTS.keyboard = false // changes default for the modal plugin's `keyboard` option to false
{% endhighlight %}
### No conflict
## No conflict
Sometimes it is necessary to use Bootstrap plugins with other UI frameworks. In these circumstances, namespace collisions can occasionally occur. If this happens, you may call `.noConflict` on the plugin you wish to revert the value of.
@@ -63,7 +68,7 @@ var bootstrapButton = $.fn.button.noConflict() // return $.fn.button to previous
$.fn.bootstrapBtn = bootstrapButton // give $().bootstrapBtn the Bootstrap functionality
{% endhighlight %}
### Events
## Events
Bootstrap provides custom events for most plugins' unique actions. Generally, these come in an infinitive and past participle form - where the infinitive (ex. `show`) is triggered at the start of an event, and its past participle form (ex. `shown`) is triggered on the completion of an action.
@@ -75,7 +80,7 @@ $('#myModal').on('show.bs.modal', function (e) {
})
{% endhighlight %}
### Version numbers
## Version numbers
The version of each of Bootstrap's jQuery plugins can be accessed via the `VERSION` property of the plugin's constructor. For example, for the tooltip plugin:
@@ -83,7 +88,7 @@ The version of each of Bootstrap's jQuery plugins can be accessed via the `VERSI
$.fn.tooltip.Constructor.VERSION // => "{{ site.current_version }}"
{% endhighlight %}
### No special fallbacks when JavaScript is disabled
## No special fallbacks when JavaScript is disabled
Bootstrap's plugins don't fall back particularly gracefully when JavaScript is disabled. If you care about the user experience in this case, use [`<noscript>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/noscript) to explain the situation (and how to re-enable JavaScript) to your users, and/or add your own custom fallbacks.
+5
View File
@@ -5,6 +5,11 @@ title: Supported platforms
Bootstrap is built to work best with the latest techniques. As such, older desktop and mobile browsers may display differently, but should remain fully functional.
## Contents
* Will be replaced with the ToC, excluding the "Contents" header
{:toc}
## Supported browsers
Bootstrap supports the **latest, stable releases** of all major browsers and platforms. On Windows, **we support Internet Explorer 9-11**. More specific support information is provided below.