[](https://david-dm.org/twbs/bootstrap?type=peer)
[](https://david-dm.org/twbs/bootstrap?type=dev)
[](https://coveralls.io/github/twbs/bootstrap?branch=v4-dev)
-[](https://github.com/twbs/bootstrap/tree/v4-dev/dist/css/bootstrap.min.css)
-[](https://github.com/twbs/bootstrap/tree/v4-dev/dist/js/bootstrap.min.js)
+[](https://github.com/twbs/bootstrap/tree/v4-dev/dist/css/bootstrap.min.css)
+[](https://github.com/twbs/bootstrap/tree/v4-dev/dist/js/bootstrap.min.js)
[](https://www.browserstack.com/automate/public-build/SkxZcStBeExEdVJqQ2hWYnlWckpkNmNEY213SFp6WHFETWk2bGFuY3pCbz0tLXhqbHJsVlZhQnRBdEpod3NLSDMzaHc9PQ==--3d0b75245708616eb93113221beece33e680b229)
## What's included
3. Run `npm start` to compile CSS and JavaScript files, generate our docs, and watch for changes.
4. Open `http://localhost:9001` in your browser, and voilà.
-Learn more about using Jekyll by reading its [documentation](https://jekyllrb.com/docs/home/).
+Learn more about using Jekyll by reading its [documentation](https://jekyllrb.com/docs/).
### Documentation for previous releases
## How does Bootstrap's test suite work?
-Bootstrap uses [QUnit](https://qunitjs.com/) and [Sinon](http://sinonjs.org/). Each plugin has a file dedicated to its tests in `unit/<plugin-name>.js`.
+Bootstrap uses [QUnit](https://qunitjs.com/) and [Sinon](http
s://sinonjs.org/). Each plugin has a file dedicated to its tests in `unit/<plugin-name>.js`.
* `unit/` contains the unit test files for each Bootstrap plugin.
* `vendor/` contains third-party testing-related code (QUnit, jQuery and Sinon).
- name: 中文(繁體)
code: zh-tw
description: Bootstrap 4 繁體中文手冊
- url: http://bootstrap.hexschool.com/
+ url: https://bootstrap.hexschool.com/
- name: Chinese
code: zh
description: Bootstrap 4 · 全球最流行的 HTML、CSS 和 JS 工具库。
- url: https://code.z01.com/v4
+ url: https://code.z01.com/v4/
- name: Chinese
code: zh
- name: Brazilian Portuguese
code: pt-BR
description: Bootstrap 4 Português do Brasil
- url: http://getbootstrap.com.br/v4/
+ url: https://getbootstrap.com.br/v4/
## Aligning images
-Align images with the [helper float classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/float) or [text alignment classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/text/#text-alignment). `block`-level images can be centered using [the `.mx-auto` margin utility class]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/spacing/#horizontal-centering).
+Align images with the [helper float classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/float/) or [text alignment classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/text/#text-alignment). `block`-level images can be centered using [the `.mx-auto` margin utility class]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/spacing/#horizontal-centering).
<div class="bd-example bd-example-images">
<img data-src="holder.js/200x200" class="rounded float-left" alt="A generic square placeholder image with rounded corners">
<div class="container">
<h1 class="mt-5">Sticky footer with fixed navbar</h1>
<p class="lead">Pin a footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS. A fixed navbar has been added with <code>padding-top: 60px;</code> on the <code>main > .container</code>.</p>
- <p>Back to <a href="../sticky-footer">the default sticky footer</a> minus the navbar.</p>
+ <p>Back to <a href="../sticky-footer/">the default sticky footer</a> minus the navbar.</p>
</div>
</main>
<div class="container">
<h1 class="mt-5">Sticky footer</h1>
<p class="lead">Pin a footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.</p>
- <p>Use <a href="../sticky-footer-navbar">the sticky footer with a fixed navbar</a> if need be, too.</p>
+ <p>Use <a href="../sticky-footer-navbar/">the sticky footer with a fixed navbar</a> if need be, too.</p>
</div>
</main>
While we haven't tried these out, they do look promising and provide multiple formats—including SVG.
- [Bytesize](https://github.com/danklammer/bytesize-icons)
-- [Google Material icons](https://material.io/icons/)
+- [Google Material icons](https://material.io/tools/icons/)
- [Ionicons](https://ionicons.com/)
- [Feather](https://feathericons.com/)
- [Dripicons](http://demo.amitjakhu.com/dripicons/)
### Interactive components
-Bootstrap's interactive components—such as modal dialogs, dropdown menus and custom tooltips—are designed to work for touch, mouse and keyboard users. Through the use of relevant [<abbr title="Web Accessibility Initiative">WAI</abbr>-<abbr title="Accessible Rich Internet Applications">ARIA</abbr>](https://www.w3.org/WAI/intro/aria) roles and attributes, these components should also be understandable and operable using assistive technologies (such as screen readers).
+Bootstrap's interactive components—such as modal dialogs, dropdown menus and custom tooltips—are designed to work for touch, mouse and keyboard users. Through the use of relevant [<abbr title="Web Accessibility Initiative">WAI</abbr>-<abbr title="Accessible Rich Internet Applications">ARIA</abbr>](https://www.w3.org/WAI/standards-guidelines/aria/) roles and attributes, these components should also be understandable and operable using assistive technologies (such as screen readers).
Because Bootstrap's components are purposely designed to be fairly generic, authors may need to include further <abbr title="Accessible Rich Internet Applications">ARIA</abbr> roles and attributes, as well as JavaScript behavior, to more accurately convey the precise nature and functionality of their component. This is usually noted in the documentation.
2. From the root `/bootstrap` directory, run `npm run docs-serve` in the command line.
3. Open `http://localhost:9001` in your browser, and voilà.
-Learn more about using Jekyll by reading its [documentation](https://jekyllrb.com/docs/home/).
+Learn more about using Jekyll by reading its [documentation](https://jekyllrb.com/docs/).
## Troubleshooting
### Vendor prefix mixins
-Bootstrap 3's [vendor prefix](https://www.thoughtco.com/css-vendor-prefixes-3466867) mixins, which were deprecated in v3.2.0, have been removed in Bootstrap 4. Since we use [Autoprefixer](https://github.com/postcss/autoprefixer), they're no longer necessary.
+Bootstrap 3's [vendor prefix](https://www.lifewire.com/css-vendor-prefixes-3466867) mixins, which were deprecated in v3.2.0, have been removed in Bootstrap 4. Since we use [Autoprefixer](https://github.com/postcss/autoprefixer), they're no longer necessary.
Removed the following mixins: `animation`, `animation-delay`, `animation-direction`, `animation-duration`, `animation-fill-mode`, `animation-iteration-count`, `animation-name`, `animation-timing-function`, `backface-visibility`, `box-sizing`, `content-columns`, `hyphens`, `opacity`, `perspective`, `perspective-origin`, `rotate`, `rotateX`, `rotateY`, `scale`, `scaleX`, `scaleY`, `skew`, `transform-origin`, `transition-delay`, `transition-duration`, `transition-property`, `transition-timing-function`, `transition-transform`, `translate`, `translate3d`, `user-select`
projects / thirdparty / bootstrap.git / commitdiff
