mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-06-17 19:21:23 +03:00
v4 beta 3 docs
This commit is contained in:
Mark Otto
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons, or any other element.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Borders · Bootstrap</title>
|
||||
<title>Borders · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Borders">
|
||||
<meta name="twitter:description" content="Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons, or any other element.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Borders">
|
||||
<meta name="twitter:description" content="Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons, or any other element.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/borders/">
|
||||
<meta property="og:title" content="Borders">
|
||||
<meta property="og:description" content="Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons, or any other element.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/borders/">
|
||||
<meta property="og:title" content="Borders">
|
||||
<meta property="og:description" content="Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons, or any other element.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -674,20 +468,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -707,10 +488,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Quickly and easily clear floated content within a container by adding a clearfix utility.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Clearfix · Bootstrap</title>
|
||||
<title>Clearfix · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Clearfix">
|
||||
<meta name="twitter:description" content="Quickly and easily clear floated content within a container by adding a clearfix utility.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Clearfix">
|
||||
<meta name="twitter:description" content="Quickly and easily clear floated content within a container by adding a clearfix utility.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/clearfix/">
|
||||
<meta property="og:title" content="Clearfix">
|
||||
<meta property="og:description" content="Quickly and easily clear floated content within a container by adding a clearfix utility.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/clearfix/">
|
||||
<meta property="og:title" content="Clearfix">
|
||||
<meta property="og:description" content="Quickly and easily clear floated content within a container by adding a clearfix utility.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -630,20 +424,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -663,10 +444,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Use a generic close icon for dismissing content like modals and alerts.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Close icon · Bootstrap</title>
|
||||
<title>Close icon · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Close icon">
|
||||
<meta name="twitter:description" content="Use a generic close icon for dismissing content like modals and alerts.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Close icon">
|
||||
<meta name="twitter:description" content="Use a generic close icon for dismissing content like modals and alerts.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/close-icon/">
|
||||
<meta property="og:title" content="Close icon">
|
||||
<meta property="og:description" content="Use a generic close icon for dismissing content like modals and alerts.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/close-icon/">
|
||||
<meta property="og:title" content="Close icon">
|
||||
<meta property="og:description" content="Use a generic close icon for dismissing content like modals and alerts.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -610,20 +404,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -643,10 +424,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Convey meaning through color with a handful of color utility classes. Includes support for styling links with hover states, too.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Colors · Bootstrap</title>
|
||||
<title>Colors · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Colors">
|
||||
<meta name="twitter:description" content="Convey meaning through color with a handful of color utility classes. Includes support for styling links with hover states, too.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Colors">
|
||||
<meta name="twitter:description" content="Convey meaning through color with a handful of color utility classes. Includes support for styling links with hover states, too.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/colors/">
|
||||
<meta property="og:title" content="Colors">
|
||||
<meta property="og:description" content="Convey meaning through color with a handful of color utility classes. Includes support for styling links with hover states, too.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/colors/">
|
||||
<meta property="og:title" content="Colors">
|
||||
<meta property="og:description" content="Convey meaning through color with a handful of color utility classes. Includes support for styling links with hover states, too.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -587,7 +381,6 @@
|
||||
<li class="toc-entry toc-h2"><a href="#background-gradient">Background gradient</a>
|
||||
<ul>
|
||||
<li class="toc-entry toc-h4"><a href="#dealing-with-specificity">Dealing with specificity</a></li>
|
||||
<li class="toc-entry toc-h4"><a href="#conveying-meaning-to-assistive-technologies">Conveying meaning to assistive technologies</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -658,7 +451,7 @@
|
||||
<div class="p-3 mb-2 bg-secondary text-white">.bg-secondary</div>
|
||||
<div class="p-3 mb-2 bg-success text-white">.bg-success</div>
|
||||
<div class="p-3 mb-2 bg-danger text-white">.bg-danger</div>
|
||||
<div class="p-3 mb-2 bg-warning text-white">.bg-warning</div>
|
||||
<div class="p-3 mb-2 bg-warning text-dark">.bg-warning</div>
|
||||
<div class="p-3 mb-2 bg-info text-white">.bg-info</div>
|
||||
<div class="p-3 mb-2 bg-light text-dark">.bg-light</div>
|
||||
<div class="p-3 mb-2 bg-dark text-white">.bg-dark</div>
|
||||
@@ -668,7 +461,7 @@
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-secondary text-white"</span><span class="nt">></span>.bg-secondary<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-success text-white"</span><span class="nt">></span>.bg-success<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-danger text-white"</span><span class="nt">></span>.bg-danger<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-warning text-white"</span><span class="nt">></span>.bg-warning<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-warning text-dark"</span><span class="nt">></span>.bg-warning<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-info text-white"</span><span class="nt">></span>.bg-info<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-light text-dark"</span><span class="nt">></span>.bg-light<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-dark text-white"</span><span class="nt">></span>.bg-dark<span class="nt"></div></span>
|
||||
@@ -683,7 +476,7 @@
|
||||
<div class="p-3 mb-2 bg-gradient-secondary text-white">.bg-gradient-secondary</div>
|
||||
<div class="p-3 mb-2 bg-gradient-success text-white">.bg-gradient-success</div>
|
||||
<div class="p-3 mb-2 bg-gradient-danger text-white">.bg-gradient-danger</div>
|
||||
<div class="p-3 mb-2 bg-gradient-warning text-white">.bg-gradient-warning</div>
|
||||
<div class="p-3 mb-2 bg-gradient-warning text-dark">.bg-gradient-warning</div>
|
||||
<div class="p-3 mb-2 bg-gradient-info text-white">.bg-gradient-info</div>
|
||||
<div class="p-3 mb-2 bg-gradient-light text-dark">.bg-gradient-light</div>
|
||||
<div class="p-3 mb-2 bg-gradient-dark text-white">.bg-gradient-dark</div>
|
||||
@@ -692,7 +485,7 @@
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-gradient-secondary text-white"</span><span class="nt">></span>.bg-gradient-secondary<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-gradient-success text-white"</span><span class="nt">></span>.bg-gradient-success<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-gradient-danger text-white"</span><span class="nt">></span>.bg-gradient-danger<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-gradient-warning text-white"</span><span class="nt">></span>.bg-gradient-warning<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-gradient-warning text-dark"</span><span class="nt">></span>.bg-gradient-warning<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-gradient-info text-white"</span><span class="nt">></span>.bg-gradient-info<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-gradient-light text-dark"</span><span class="nt">></span>.bg-gradient-light<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"p-3 mb-2 bg-gradient-dark text-white"</span><span class="nt">></span>.bg-gradient-dark<span class="nt"></div></span></code></pre></div>
|
||||
@@ -704,7 +497,7 @@
|
||||
</div>
|
||||
|
||||
<div class="bd-callout bd-callout-warning">
|
||||
<h4 id="conveying-meaning-to-assistive-technologies">Conveying meaning to assistive technologies</h4>
|
||||
<h5 id="conveying-meaning-to-assistive-technologies">Conveying meaning to assistive technologies</h5>
|
||||
|
||||
<p>Using color to add meaning only provides a visual indication, which will not be conveyed to users of assistive technologies – such as screen readers. Ensure that information denoted by the color is either obvious from the content itself (e.g. the visible text), or is included through alternative means, such as additional text hidden with the <code class="highlighter-rouge">.sr-only</code> class.</p>
|
||||
</div>
|
||||
@@ -717,20 +510,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -750,10 +530,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Quickly and responsively toggle the display value of components and more with our display utilities. Includes support for some of the more common values, as well as some extras for controlling display when printing.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Display property · Bootstrap</title>
|
||||
<title>Display property · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Display property">
|
||||
<meta name="twitter:description" content="Quickly and responsively toggle the display value of components and more with our display utilities. Includes support for some of the more common values, as well as some extras for controlling display when printing.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Display property">
|
||||
<meta name="twitter:description" content="Quickly and responsively toggle the display value of components and more with our display utilities. Includes support for some of the more common values, as well as some extras for controlling display when printing.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/display/">
|
||||
<meta property="og:title" content="Display property">
|
||||
<meta property="og:description" content="Quickly and responsively toggle the display value of components and more with our display utilities. Includes support for some of the more common values, as well as some extras for controlling display when printing.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/display/">
|
||||
<meta property="og:title" content="Display property">
|
||||
<meta property="og:description" content="Quickly and responsively toggle the display value of components and more with our display utilities. Includes support for some of the more common values, as well as some extras for controlling display when printing.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -582,7 +376,9 @@
|
||||
|
||||
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||
<ul class="section-nav">
|
||||
<li class="toc-entry toc-h2"><a href="#common-display-values">Common display values</a></li>
|
||||
<li class="toc-entry toc-h2"><a href="#how-it-works">How it works</a></li>
|
||||
<li class="toc-entry toc-h2"><a href="#notation">Notation</a></li>
|
||||
<li class="toc-entry toc-h2"><a href="#examples">Examples</a></li>
|
||||
<li class="toc-entry toc-h2"><a href="#hiding-elements">Hiding Elements</a></li>
|
||||
<li class="toc-entry toc-h2"><a href="#display-in-print">Display in print</a></li>
|
||||
</ul>
|
||||
@@ -594,94 +390,60 @@
|
||||
<p class="bd-lead">Quickly and responsively toggle the display value of components and more with our display utilities. Includes support for some of the more common values, as well as some extras for controlling display when printing.</p>
|
||||
<script async src="https://cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=getbootstrapcom" id="_carbonads_js"></script>
|
||||
|
||||
<h2 id="common-display-values">Common <code class="highlighter-rouge">display</code> values</h2>
|
||||
<h2 id="how-it-works">How it works</h2>
|
||||
|
||||
<p>The <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/display"><code class="highlighter-rouge">display</code> property</a> accepts a handful of values and we support many of them with utility classes. We purposefully don’t provide every value as a utility, so here’s what we support:</p>
|
||||
<p>Change the value of the <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/display"><code class="highlighter-rouge">display</code> property</a> with our responsive display utility classes. We purposely support only a subset of all possible values for <code class="highlighter-rouge">display</code>. Classes can be combined for various effects as you need.</p>
|
||||
|
||||
<h2 id="notation">Notation</h2>
|
||||
|
||||
<p>Display utility classes that apply to all <a href="/docs/4.0/layout/overview/#responsive-breakpoints">breakpoints</a>, from <code class="highlighter-rouge">xs</code> to <code class="highlighter-rouge">xl</code>, have no breakpoint abbreviation in them. This is because those classes are applied from <code class="highlighter-rouge">min-width: 0;</code> and up, and thus are not bound by a media query. The remaining breakpoints, however, do include a breakpoint abbreviation.</p>
|
||||
|
||||
<p>As such, the classes are named using the format:</p>
|
||||
|
||||
<ul>
|
||||
<li><code class="highlighter-rouge">.d-none</code></li>
|
||||
<li><code class="highlighter-rouge">.d-inline</code></li>
|
||||
<li><code class="highlighter-rouge">.d-inline-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-table</code></li>
|
||||
<li><code class="highlighter-rouge">.d-table-cell</code></li>
|
||||
<li><code class="highlighter-rouge">.d-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-inline-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-{value}</code> for <code class="highlighter-rouge">xs</code></li>
|
||||
<li><code class="highlighter-rouge">.d-{breakpoint}-{value}</code> for <code class="highlighter-rouge">sm</code>, <code class="highlighter-rouge">md</code>, <code class="highlighter-rouge">lg</code>, and <code class="highlighter-rouge">xl</code>.</li>
|
||||
</ul>
|
||||
|
||||
<p>Put them to use by applying any of the classes to an element of your choice. For example, here’s how you could use the inline, block, or inline-block utilities (the same applies to the other classes).</p>
|
||||
|
||||
<div class="bd-example">
|
||||
<div class="d-inline bg-success">d-inline</div>
|
||||
<div class="d-inline bg-success">d-inline</div>
|
||||
</div>
|
||||
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-inline bg-success"</span><span class="nt">></span>d-inline<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-inline bg-success"</span><span class="nt">></span>d-inline<span class="nt"></div></span></code></pre></div>
|
||||
|
||||
<div class="bd-example">
|
||||
<span class="d-block bg-primary">d-block</span>
|
||||
</div>
|
||||
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"d-block bg-primary"</span><span class="nt">></span>d-block<span class="nt"></span></span></code></pre></div>
|
||||
|
||||
<div class="bd-example">
|
||||
<div class="d-inline-block bg-warning">d-inline-block</div>
|
||||
<div class="d-inline-block bg-warning">d-inline-block</div>
|
||||
</div>
|
||||
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-inline-block bg-warning"</span><span class="nt">></span>d-inline-block<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-inline-block bg-warning"</span><span class="nt">></span>d-inline-block<span class="nt"></div></span></code></pre></div>
|
||||
|
||||
<p>Responsive variations also exist for every single utility mentioned above.</p>
|
||||
<p>Where <em>display</em> is one of:</p>
|
||||
|
||||
<ul>
|
||||
<li><code class="highlighter-rouge">.d-none</code></li>
|
||||
<li><code class="highlighter-rouge">.d-inline</code></li>
|
||||
<li><code class="highlighter-rouge">.d-inline-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-table</code></li>
|
||||
<li><code class="highlighter-rouge">.d-table-cell</code></li>
|
||||
<li><code class="highlighter-rouge">.d-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-inline-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-sm-none</code></li>
|
||||
<li><code class="highlighter-rouge">.d-sm-inline</code></li>
|
||||
<li><code class="highlighter-rouge">.d-sm-inline-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-sm-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-sm-table</code></li>
|
||||
<li><code class="highlighter-rouge">.d-sm-table-cell</code></li>
|
||||
<li><code class="highlighter-rouge">.d-sm-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-sm-inline-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-md-none</code></li>
|
||||
<li><code class="highlighter-rouge">.d-md-inline</code></li>
|
||||
<li><code class="highlighter-rouge">.d-md-inline-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-md-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-md-table</code></li>
|
||||
<li><code class="highlighter-rouge">.d-md-table-cell</code></li>
|
||||
<li><code class="highlighter-rouge">.d-md-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-md-inline-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-lg-none</code></li>
|
||||
<li><code class="highlighter-rouge">.d-lg-inline</code></li>
|
||||
<li><code class="highlighter-rouge">.d-lg-inline-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-lg-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-lg-table</code></li>
|
||||
<li><code class="highlighter-rouge">.d-lg-table-cell</code></li>
|
||||
<li><code class="highlighter-rouge">.d-lg-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-lg-inline-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-xl-none</code></li>
|
||||
<li><code class="highlighter-rouge">.d-xl-inline</code></li>
|
||||
<li><code class="highlighter-rouge">.d-xl-inline-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-xl-block</code></li>
|
||||
<li><code class="highlighter-rouge">.d-xl-table</code></li>
|
||||
<li><code class="highlighter-rouge">.d-xl-table-cell</code></li>
|
||||
<li><code class="highlighter-rouge">.d-xl-flex</code></li>
|
||||
<li><code class="highlighter-rouge">.d-xl-inline-flex</code></li>
|
||||
<li><code class="highlighter-rouge">none</code></li>
|
||||
<li><code class="highlighter-rouge">inline</code></li>
|
||||
<li><code class="highlighter-rouge">inline-block</code></li>
|
||||
<li><code class="highlighter-rouge">block</code></li>
|
||||
<li><code class="highlighter-rouge">table</code></li>
|
||||
<li><code class="highlighter-rouge">table-cell</code></li>
|
||||
<li><code class="highlighter-rouge">table-row</code></li>
|
||||
<li><code class="highlighter-rouge">flex</code></li>
|
||||
<li><code class="highlighter-rouge">inline-flex</code></li>
|
||||
</ul>
|
||||
|
||||
<p>The media queries effect screen widths with the given breakpoint <em>or larger</em>. For example, <code class="highlighter-rouge">.d-lg-none</code> sets <code class="highlighter-rouge">display: none;</code> on both <code class="highlighter-rouge">lg</code> and <code class="highlighter-rouge">xl</code> screens.</p>
|
||||
|
||||
<h2 id="examples">Examples</h2>
|
||||
|
||||
<div class="bd-example">
|
||||
<div class="d-inline p-2 bg-primary text-white">d-inline</div>
|
||||
<div class="d-inline p-2 bg-dark text-white">d-inline</div>
|
||||
</div>
|
||||
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-inline p-2 bg-primary text-white"</span><span class="nt">></span>d-inline<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-inline p-2 bg-dark text-white"</span><span class="nt">></span>d-inline<span class="nt"></div></span></code></pre></div>
|
||||
|
||||
<div class="bd-example">
|
||||
<span class="d-block p-2 bg-primary text-white">d-block</span>
|
||||
<span class="d-block p-2 bg-dark text-white">d-block</span>
|
||||
</div>
|
||||
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"d-block p-2 bg-primary text-white"</span><span class="nt">></span>d-block<span class="nt"></span></span>
|
||||
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"d-block p-2 bg-dark text-white"</span><span class="nt">></span>d-block<span class="nt"></span></span></code></pre></div>
|
||||
|
||||
<h2 id="hiding-elements">Hiding Elements</h2>
|
||||
|
||||
<p>For faster mobile-friendly development, use responsive display classes for showing and hiding elements by device. Avoid creating entirely different versions of the same site, instead hide element responsively for each screen size.</p>
|
||||
|
||||
<p>To hide elements simply use the <code class="highlighter-rouge">.d-none</code> class or one of the <code class="highlighter-rouge">.d-{sm,md,lg,xl}-none</code> classes for any responsive screen variation.</p>
|
||||
|
||||
<p>To show an element only on a given interval of screen sizes you can combine one <code class="highlighter-rouge">.d-*-none</code> class with a <code class="highlighter-rouge">.d-*-*</code> class, for example <code class="highlighter-rouge">.d-none.d-md-block.d-xl-none</code> will hide the element for all screen sizes except on medium and large devices.</p>
|
||||
<p>To show an element only on a given interval of screen sizes you can combine one <code class="highlighter-rouge">.d-*-none</code> class with a <code class="highlighter-rouge">.d-*-*</code> class, for example <code class="highlighter-rouge">.d-none .d-md-block .d-xl-none</code> will hide the element for all screen sizes except on medium and large devices.</p>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
@@ -693,58 +455,65 @@
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Hidden on all</td>
|
||||
<td><code class="highlighter-rouge">d-none</code></td>
|
||||
<td><code class="highlighter-rouge">.d-none</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Hidden only on xs</td>
|
||||
<td><code class="highlighter-rouge">d-none d-sm-block</code></td>
|
||||
<td><code class="highlighter-rouge">.d-none .d-sm-block</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Hidden only on sm</td>
|
||||
<td><code class="highlighter-rouge">d-sm-none d-md-block</code></td>
|
||||
<td><code class="highlighter-rouge">.d-sm-none .d-md-block</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Hidden only on md</td>
|
||||
<td><code class="highlighter-rouge">d-md-none d-lg-block</code></td>
|
||||
<td><code class="highlighter-rouge">.d-md-none .d-lg-block</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Hidden only on lg</td>
|
||||
<td><code class="highlighter-rouge">d-lg-none d-xl-block</code></td>
|
||||
<td><code class="highlighter-rouge">.d-lg-none .d-xl-block</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Hidden only on xl</td>
|
||||
<td><code class="highlighter-rouge">d-xl-none</code></td>
|
||||
<td><code class="highlighter-rouge">.d-xl-none</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Visible on all</td>
|
||||
<td><code class="highlighter-rouge">d-block</code></td>
|
||||
<td><code class="highlighter-rouge">.d-block</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Visible only on xs</td>
|
||||
<td><code class="highlighter-rouge">d-block d-sm-none</code></td>
|
||||
<td><code class="highlighter-rouge">.d-block .d-sm-none</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Visible only on sm</td>
|
||||
<td><code class="highlighter-rouge">d-none d-sm-block d-md-none</code></td>
|
||||
<td><code class="highlighter-rouge">.d-none .d-sm-block .d-md-none</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Visible only on md</td>
|
||||
<td><code class="highlighter-rouge">d-none d-md-block d-lg-none</code></td>
|
||||
<td><code class="highlighter-rouge">.d-none .d-md-block .d-lg-none</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Visible only on lg</td>
|
||||
<td><code class="highlighter-rouge">d-none d-lg-block d-xl-none</code></td>
|
||||
<td><code class="highlighter-rouge">.d-none .d-lg-block .d-xl-none</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Visible only on xl</td>
|
||||
<td><code class="highlighter-rouge">d-none d-xl-block</code></td>
|
||||
<td><code class="highlighter-rouge">.d-none .d-xl-block</code></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="bd-example">
|
||||
<div class="d-lg-none">hide on screens wider than lg</div>
|
||||
<div class="d-none d-lg-block">hide on screens smaller than lg</div>
|
||||
</div>
|
||||
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-lg-none"</span><span class="nt">></span>hide on screens wider than lg<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-none d-lg-block"</span><span class="nt">></span>hide on screens smaller than lg<span class="nt"></div></span></code></pre></div>
|
||||
|
||||
<h2 id="display-in-print">Display in print</h2>
|
||||
|
||||
<p>Change the <code class="highlighter-rouge">display</code> value of elements when printing with our print display utilities.</p>
|
||||
<p>Change the <code class="highlighter-rouge">display</code> value of elements when printing with our print display utility classes.</p>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
@@ -756,23 +525,35 @@
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code class="highlighter-rouge">.d-print-block</code></td>
|
||||
<td>Applies <code class="highlighter-rouge">display: block</code> to the element when printing</td>
|
||||
<td>Applies <code class="highlighter-rouge">display: block;</code> to the element when printing</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code class="highlighter-rouge">.d-print-inline</code></td>
|
||||
<td>Applies <code class="highlighter-rouge">display: inline</code> to the element when printing</td>
|
||||
<td>Applies <code class="highlighter-rouge">display: inline;</code> to the element when printing</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code class="highlighter-rouge">.d-print-inline-block</code></td>
|
||||
<td>Applies <code class="highlighter-rouge">display: inline-block</code> to the element when printing</td>
|
||||
<td>Applies <code class="highlighter-rouge">display: inline-block;</code> to the element when printing</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code class="highlighter-rouge">.d-print-none</code></td>
|
||||
<td>Applies <code class="highlighter-rouge">display: none</code> to the element when printing</td>
|
||||
<td>Applies <code class="highlighter-rouge">display: none;</code> to the element when printing</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<p>The print and display classes can be combined.</p>
|
||||
|
||||
<div class="bd-example">
|
||||
<div class="d-print-none">Screen Only (Hide on print only)</div>
|
||||
<div class="d-none d-print-block">Print Only (Hide on screen only)</div>
|
||||
<div class="d-none d-lg-block d-print-block">Hide up to large on screen, but always show on print</div>
|
||||
</div>
|
||||
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-print-none"</span><span class="nt">></span>Screen Only (Hide on print only)<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-none d-print-block"</span><span class="nt">></span>Print Only (Hide on screen only)<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"d-none d-lg-block d-print-block"</span><span class="nt">></span>Hide up to large on screen, but always show on print<span class="nt"></div></span></code></pre></div>
|
||||
|
||||
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
@@ -780,20 +561,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -813,10 +581,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Create responsive video or slideshow embeds based on the width of the parent by creating an intrinsic ratio that scales on any device.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Embeds · Bootstrap</title>
|
||||
<title>Embeds · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Embeds">
|
||||
<meta name="twitter:description" content="Create responsive video or slideshow embeds based on the width of the parent by creating an intrinsic ratio that scales on any device.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Embeds">
|
||||
<meta name="twitter:description" content="Create responsive video or slideshow embeds based on the width of the parent by creating an intrinsic ratio that scales on any device.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/embed/">
|
||||
<meta property="og:title" content="Embeds">
|
||||
<meta property="og:description" content="Create responsive video or slideshow embeds based on the width of the parent by creating an intrinsic ratio that scales on any device.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/embed/">
|
||||
<meta property="og:title" content="Embeds">
|
||||
<meta property="og:description" content="Create responsive video or slideshow embeds based on the width of the parent by creating an intrinsic ratio that scales on any device.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -645,20 +439,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -678,10 +459,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities. For more complex implementations, custom CSS may be necessary.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Flex · Bootstrap</title>
|
||||
<title>Flex · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Flex">
|
||||
<meta name="twitter:description" content="Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities. For more complex implementations, custom CSS may be necessary.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Flex">
|
||||
<meta name="twitter:description" content="Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities. For more complex implementations, custom CSS may be necessary.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/flex/">
|
||||
<meta property="og:title" content="Flex">
|
||||
<meta property="og:description" content="Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities. For more complex implementations, custom CSS may be necessary.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/flex/">
|
||||
<meta property="og:title" content="Flex">
|
||||
<meta property="og:description" content="Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities. For more complex implementations, custom CSS may be necessary.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -993,17 +787,7 @@
|
||||
<p>Change how flex items wrap in a flex container. Choose from no wrapping at all (the browser default) with <code class="highlighter-rouge">.flex-nowrap</code>, wrapping with <code class="highlighter-rouge">.flex-wrap</code>, or reverse wrapping with <code class="highlighter-rouge">.flex-wrap-reverse</code>.</p>
|
||||
|
||||
<div class="bd-example">
|
||||
<div class="d-flex flex-nowrap bd-highlight">
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="d-flex flex-nowrap bd-highlight" style="width: 8rem;">
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
@@ -1343,20 +1127,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -1376,10 +1147,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Toggle floats on any element, across any breakpoint, using our responsive float utilities.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Float · Bootstrap</title>
|
||||
<title>Float · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Float">
|
||||
<meta name="twitter:description" content="Toggle floats on any element, across any breakpoint, using our responsive float utilities.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Float">
|
||||
<meta name="twitter:description" content="Toggle floats on any element, across any breakpoint, using our responsive float utilities.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/float/">
|
||||
<meta property="og:title" content="Float">
|
||||
<meta property="og:description" content="Toggle floats on any element, across any breakpoint, using our responsive float utilities.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/float/">
|
||||
<meta property="og:title" content="Float">
|
||||
<meta property="og:description" content="Toggle floats on any element, across any breakpoint, using our responsive float utilities.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -668,20 +462,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -701,10 +482,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Swap text for background images with the image replacement class.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Image replacement · Bootstrap</title>
|
||||
<title>Image replacement · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Image replacement">
|
||||
<meta name="twitter:description" content="Swap text for background images with the image replacement class.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Image replacement">
|
||||
<meta name="twitter:description" content="Swap text for background images with the image replacement class.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/image-replacement/">
|
||||
<meta property="og:title" content="Image replacement">
|
||||
<meta property="og:description" content="Swap text for background images with the image replacement class.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/image-replacement/">
|
||||
<meta property="og:title" content="Image replacement">
|
||||
<meta property="og:description" content="Swap text for background images with the image replacement class.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -582,7 +376,6 @@
|
||||
|
||||
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||
<ul class="section-nav">
|
||||
<li class="toc-entry toc-h1"><a href="#bootstrap">Bootstrap</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@@ -616,20 +409,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -649,10 +429,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,9 +3,10 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<title>Bootstrap - Content moved</title>
|
||||
<title>Bootstrap · Content moved</title>
|
||||
<link rel="canonical" href="https://getbootstrap.com/docs/4.0/utilities/borders/">
|
||||
<meta http-equiv="refresh" content="0; url=https://getbootstrap.com/docs/4.0/utilities/borders/">
|
||||
<meta name="robots" content="noindex">
|
||||
<style>
|
||||
html {
|
||||
display: flex;
|
||||
@@ -30,7 +31,7 @@
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Redirecting…</h1>
|
||||
<h1>Redirecting…</h1>
|
||||
<a href="https://getbootstrap.com/docs/4.0/utilities/borders/">Click here if you are not redirected</a>
|
||||
<script>window.location="https://getbootstrap.com/docs/4.0/utilities/borders/";</script>
|
||||
</body>
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Use these shorthand utilities for quickly configuring the position of an element.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Position · Bootstrap</title>
|
||||
<title>Position · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Position">
|
||||
<meta name="twitter:description" content="Use these shorthand utilities for quickly configuring the position of an element.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Position">
|
||||
<meta name="twitter:description" content="Use these shorthand utilities for quickly configuring the position of an element.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/position/">
|
||||
<meta property="og:title" content="Position">
|
||||
<meta property="og:description" content="Use these shorthand utilities for quickly configuring the position of an element.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/position/">
|
||||
<meta property="og:title" content="Position">
|
||||
<meta property="og:description" content="Use these shorthand utilities for quickly configuring the position of an element.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -633,20 +427,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -666,10 +447,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Use screenreader utilities to hide elements on all devices except screen readers.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Screenreaders · Bootstrap</title>
|
||||
<title>Screenreaders · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Screenreaders">
|
||||
<meta name="twitter:description" content="Use screenreader utilities to hide elements on all devices except screen readers.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Screenreaders">
|
||||
<meta name="twitter:description" content="Use screenreader utilities to hide elements on all devices except screen readers.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/screenreaders/">
|
||||
<meta property="og:title" content="Screenreaders">
|
||||
<meta property="og:description" content="Use screenreader utilities to hide elements on all devices except screen readers.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/screenreaders/">
|
||||
<meta property="og:title" content="Screenreaders">
|
||||
<meta property="og:description" content="Use screenreader utilities to hide elements on all devices except screen readers.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -592,7 +386,6 @@
|
||||
<script async src="https://cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=getbootstrapcom" id="_carbonads_js"></script>
|
||||
|
||||
<p>Hide an element to all devices <strong>except screen readers</strong> with <code class="highlighter-rouge">.sr-only</code>. Combine <code class="highlighter-rouge">.sr-only</code> with <code class="highlighter-rouge">.sr-only-focusable</code> to show the element again when it’s focused (e.g. by a keyboard-only user). Can also be used as mixins.</p>
|
||||
|
||||
<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"sr-only sr-only-focusable"</span> <span class="na">href=</span><span class="s">"#content"</span><span class="nt">></span>Skip to main content<span class="nt"></a></span></code></pre></figure>
|
||||
|
||||
<figure class="highlight"><pre><code class="language-scss" data-lang="scss"><span class="c1">// Usage as a mixin
|
||||
@@ -609,20 +402,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -642,10 +422,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Easily make an element as wide or as tall (relative to its parent) with our width and height utilities.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Sizing · Bootstrap</title>
|
||||
<title>Sizing · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Sizing">
|
||||
<meta name="twitter:description" content="Easily make an element as wide or as tall (relative to its parent) with our width and height utilities.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Sizing">
|
||||
<meta name="twitter:description" content="Easily make an element as wide or as tall (relative to its parent) with our width and height utilities.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/sizing/">
|
||||
<meta property="og:title" content="Sizing">
|
||||
<meta property="og:description" content="Easily make an element as wide or as tall (relative to its parent) with our width and height utilities.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/sizing/">
|
||||
<meta property="og:title" content="Sizing">
|
||||
<meta property="og:description" content="Easily make an element as wide or as tall (relative to its parent) with our width and height utilities.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -643,20 +437,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -676,10 +457,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element’s appearance.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Spacing · Bootstrap</title>
|
||||
<title>Spacing · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Spacing">
|
||||
<meta name="twitter:description" content="Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element's appearance.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Spacing">
|
||||
<meta name="twitter:description" content="Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element’s appearance.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/spacing/">
|
||||
<meta property="og:title" content="Spacing">
|
||||
<meta property="og:description" content="Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element's appearance.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/spacing/">
|
||||
<meta property="og:title" content="Spacing">
|
||||
<meta property="og:description" content="Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element’s appearance.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -595,7 +389,7 @@
|
||||
|
||||
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||
<h1 class="bd-title" id="content">Spacing</h1>
|
||||
<p class="bd-lead">Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element's appearance.</p>
|
||||
<p class="bd-lead">Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element’s appearance.</p>
|
||||
<script async src="https://cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=getbootstrapcom" id="_carbonads_js"></script>
|
||||
|
||||
<h2 id="how-it-works">How it works</h2>
|
||||
@@ -663,6 +457,7 @@
|
||||
<span class="p">}</span></code></pre></figure>
|
||||
|
||||
<h3 id="horizontal-centering">Horizontal centering</h3>
|
||||
|
||||
<p>Additionally, Bootstrap also includes an <code class="highlighter-rouge">.mx-auto</code> class for horizontally centering fixed-width block level content—that is, content that has <code class="highlighter-rouge">display: block</code> and a <code class="highlighter-rouge">width</code> set—by setting the horizontal margins to <code class="highlighter-rouge">auto</code>.</p>
|
||||
|
||||
<div class="bd-example">
|
||||
@@ -683,20 +478,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -716,10 +498,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Documentation and examples for common text utilities to control alignment, wrapping, weight, and more.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Text · Bootstrap</title>
|
||||
<title>Text · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Text">
|
||||
<meta name="twitter:description" content="Documentation and examples for common text utilities to control alignment, wrapping, weight, and more.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Text">
|
||||
<meta name="twitter:description" content="Documentation and examples for common text utilities to control alignment, wrapping, weight, and more.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/text/">
|
||||
<meta property="og:title" content="Text">
|
||||
<meta property="og:description" content="Documentation and examples for common text utilities to control alignment, wrapping, weight, and more.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/text/">
|
||||
<meta property="og:title" content="Text">
|
||||
<meta property="og:description" content="Documentation and examples for common text utilities to control alignment, wrapping, weight, and more.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -630,22 +424,12 @@
|
||||
<p>Prevent text from wrapping with a <code class="highlighter-rouge">.text-nowrap</code> class.</p>
|
||||
|
||||
<div class="bd-example">
|
||||
<div class="row">
|
||||
<div class="col-1 text-nowrap">
|
||||
Curabitur blandit tempus ardua ridiculus sed magna.
|
||||
</div>
|
||||
<div class="col-11">
|
||||
<img data-src="holder.js/50x50" alt="An image to show the text doesn't wrap" />
|
||||
</div>
|
||||
<div class="text-nowrap bd-highlight" style="width: 8rem;">
|
||||
This text should overflow the parent.
|
||||
</div>
|
||||
</div>
|
||||
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"row"</span><span class="nt">></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"col-1 text-nowrap"</span><span class="nt">></span>
|
||||
Curabitur blandit tempus ardua ridiculus sed magna.
|
||||
<span class="nt"></div></span>
|
||||
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"col-11"</span><span class="nt">></span>
|
||||
<span class="nt"><img</span> <span class="na">src=</span><span class="s">"..."</span> <span class="na">alt=</span><span class="s">"An image to show the text doesn't wrap"</span><span class="nt">></span>
|
||||
<span class="nt"></div></span>
|
||||
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"text-nowrap"</span> <span class="na">style=</span><span class="s">"width: 8rem;"</span><span class="nt">></span>
|
||||
This text should overflow the parent.
|
||||
<span class="nt"></div></span></code></pre></div>
|
||||
|
||||
<p>For longer content, you can add a <code class="highlighter-rouge">.text-truncate</code> class to truncate the text with an ellipsis. <strong>Requires <code class="highlighter-rouge">display: inline-block</code> or <code class="highlighter-rouge">display: block</code>.</strong></p>
|
||||
@@ -713,20 +497,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -746,10 +517,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Vertical alignment · Bootstrap</title>
|
||||
<title>Vertical alignment · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Vertical alignment">
|
||||
<meta name="twitter:description" content="Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Vertical alignment">
|
||||
<meta name="twitter:description" content="Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/vertical-align/">
|
||||
<meta property="og:title" content="Vertical alignment">
|
||||
<meta property="og:description" content="Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/vertical-align/">
|
||||
<meta property="og:title" content="Vertical alignment">
|
||||
<meta property="og:description" content="Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -644,20 +438,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -677,10 +458,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
@@ -3,18 +3,20 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="generator" content="Jekyll v3.6.0">
|
||||
<meta name="description" content="Control the visibility, without modifying the display, of elements with visibility utilities.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
<meta name="generator" content="Jekyll v3.6.2">
|
||||
|
||||
<title>Visibility · Bootstrap</title>
|
||||
<title>Visibility · Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- Documentation extras -->
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" rel="stylesheet">
|
||||
|
||||
<link href="/assets/css/docs.min.css" rel="stylesheet">
|
||||
|
||||
@@ -29,28 +31,19 @@
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
|
||||
|
||||
<!-- Meta -->
|
||||
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
|
||||
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@getbootstrap">
|
||||
<meta name="twitter:creator" content="@getbootstrap">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="Visibility">
|
||||
<meta name="twitter:description" content="Control the visibility, without modifying the display, of elements with visibility utilities.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<meta name="twitter:title" content="Visibility">
|
||||
<meta name="twitter:description" content="Control the visibility, without modifying the display, of elements with visibility utilities.">
|
||||
<meta name="twitter:image" content="https://getbootstrap.com/assets/brand/bootstrap-social-logo.png">
|
||||
|
||||
<!-- Facebook -->
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/visibility/">
|
||||
<meta property="og:title" content="Visibility">
|
||||
<meta property="og:description" content="Control the visibility, without modifying the display, of elements with visibility utilities.">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/utilities/visibility/">
|
||||
<meta property="og:title" content="Visibility">
|
||||
<meta property="og:description" content="Control the visibility, without modifying the display, of elements with visibility utilities.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="http://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:secure_url" content="https://getbootstrap.com/assets/brand/bootstrap-social.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
@@ -76,10 +69,8 @@
|
||||
</a>
|
||||
|
||||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap">
|
||||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="Bootstrap"><svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||||
</a>
|
||||
|
||||
<div class="navbar-nav-scroll">
|
||||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||
@@ -121,26 +112,20 @@
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://github.com/twbs/bootstrap" target="_blank" rel="noopener" aria-label="GitHub"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener" aria-label="Twitter"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack">
|
||||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
|
||||
</a>
|
||||
<a class="nav-link p-2" href="https://bootstrap-slack.herokuapp.com" target="_blank" rel="noopener" aria-label="Slack"><svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Slack</title><path fill="currentColor" d="M210.787 234.832l68.31-22.883 22.1 65.977-68.309 22.882z"/><path d="M490.54 185.6C437.7 9.59 361.6-31.34 185.6 21.46S-31.3 150.4 21.46 326.4 150.4 543.3 326.4 490.54 543.34 361.6 490.54 185.6zM401.7 299.8l-33.15 11.05 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.38-68.36 22.92 11.46 34.38c4.5 13.92-2.87 29.06-16.78 33.56-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18l-11.46-34.43-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.5-13.92 2.87-29.06 16.78-33.56l33.12-11.03-22.1-65.9-33.15 11.05c-2.87.82-6.14 1.64-9 1.23a27.32 27.32 0 0 1-24.56-18c-4.48-13.93 2.89-29.07 16.81-33.58l33.15-11.05-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.46 34.38 68.36-22.92-11.46-34.38c-4.5-13.92 2.87-29.06 16.78-33.56s29.06 2.87 33.56 16.78l11.47 34.42 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.87 29.06-16.78 33.56L329.7 194.6l22.1 65.9 33.15-11.05c13.92-4.5 29.06 2.87 33.56 16.78s-2.88 29.07-16.81 33.57z" fill="currentColor"/></svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip">Download</a>
|
||||
<a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip">Download</a>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -149,10 +134,8 @@
|
||||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||
<form class="bd-search d-flex align-items-center">
|
||||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
|
||||
</button>
|
||||
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<nav class="collapse bd-links" id="bd-docs-nav"><div class="bd-toc-item">
|
||||
@@ -163,58 +146,31 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/getting-started/introduction/">
|
||||
Introduction
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/download/">
|
||||
Download
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/contents/">
|
||||
Contents
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/browsers-devices/">
|
||||
Browsers & devices
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/javascript/">
|
||||
JavaScript
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/theming/">
|
||||
Theming
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/build-tools/">
|
||||
Build tools
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/webpack/">
|
||||
Webpack
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/getting-started/accessibility/">
|
||||
Accessibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/layout/overview/">
|
||||
Layout
|
||||
@@ -223,28 +179,16 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/layout/overview/">
|
||||
Overview
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/grid/">
|
||||
Grid
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/layout/utilities-for-layout/">
|
||||
Utilities for layout
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/content/reboot/">
|
||||
Content
|
||||
@@ -253,40 +197,22 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/content/reboot/">
|
||||
Reboot
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/typography/">
|
||||
Typography
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/code/">
|
||||
Code
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/images/">
|
||||
Images
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/tables/">
|
||||
Tables
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/content/figures/">
|
||||
Figures
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/components/alerts/">
|
||||
Components
|
||||
@@ -295,130 +221,67 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/components/alerts/">
|
||||
Alerts
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/badge/">
|
||||
Badge
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/breadcrumb/">
|
||||
Breadcrumb
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/buttons/">
|
||||
Buttons
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/button-group/">
|
||||
Button group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/card/">
|
||||
Card
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/carousel/">
|
||||
Carousel
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/collapse/">
|
||||
Collapse
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/dropdowns/">
|
||||
Dropdowns
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/forms/">
|
||||
Forms
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/input-group/">
|
||||
Input group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/jumbotron/">
|
||||
Jumbotron
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/list-group/">
|
||||
List group
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/modal/">
|
||||
Modal
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navs/">
|
||||
Navs
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/navbar/">
|
||||
Navbar
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/popovers/">
|
||||
Popovers
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/progress/">
|
||||
Progress
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/scrollspy/">
|
||||
Scrollspy
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/components/tooltips/">
|
||||
Tooltips
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item active">
|
||||
<a class="bd-toc-link" href="/docs/4.0/utilities/borders/">
|
||||
Utilities
|
||||
@@ -427,100 +290,52 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/utilities/borders/">
|
||||
Borders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/clearfix/">
|
||||
Clearfix
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/close-icon/">
|
||||
Close icon
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/colors/">
|
||||
Colors
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/display/">
|
||||
Display
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/embed/">
|
||||
Embed
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/flex/">
|
||||
Flex
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/float/">
|
||||
Float
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/image-replacement/">
|
||||
Image replacement
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/position/">
|
||||
Position
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/screenreaders/">
|
||||
Screenreaders
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/sizing/">
|
||||
Sizing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/spacing/">
|
||||
Spacing
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/text/">
|
||||
Text
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/utilities/vertical-align/">
|
||||
Vertical align
|
||||
</a>
|
||||
|
||||
|
||||
</li><li class="active bd-sidenav-active">
|
||||
</a></li><li class="active bd-sidenav-active">
|
||||
<a href="/docs/4.0/utilities/visibility/">
|
||||
Visibility
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/extend/icons/">
|
||||
Extend
|
||||
@@ -529,10 +344,7 @@
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/extend/icons/">
|
||||
Icons
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/migration/">
|
||||
Migration
|
||||
@@ -540,41 +352,23 @@
|
||||
|
||||
<ul class="nav bd-sidenav"></ul>
|
||||
</div><div class="bd-toc-item">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/history/">
|
||||
<a class="bd-toc-link" href="/docs/4.0/about/overview/">
|
||||
About
|
||||
</a>
|
||||
|
||||
<ul class="nav bd-sidenav"><li>
|
||||
<a href="/docs/4.0/about/history/">
|
||||
History
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/team/">
|
||||
Team
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
<a href="/docs/4.0/about/overview/">
|
||||
Overview
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/brand/">
|
||||
Brand
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/license/">
|
||||
License
|
||||
</a>
|
||||
|
||||
|
||||
</li><li>
|
||||
</a></li><li>
|
||||
<a href="/docs/4.0/about/translations/">
|
||||
Translations
|
||||
</a>
|
||||
|
||||
|
||||
</li></ul>
|
||||
</a></li></ul>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
@@ -617,20 +411,7 @@
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||||
|
||||
<script src="/assets/js/vendor/popper.min.js"></script>
|
||||
|
||||
|
||||
<script src="/dist/js/bootstrap.min.js"></script>
|
||||
|
||||
|
||||
|
||||
<script src="/assets/js/docs.min.js"></script>
|
||||
|
||||
|
||||
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
<script src="/assets/js/vendor/popper.min.js"></script><script src="/dist/js/bootstrap.min.js"></script><script src="/assets/js/docs.min.js"></script><script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script>
|
||||
docsearch({
|
||||
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
|
||||
@@ -650,10 +431,7 @@
|
||||
},
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
</script><script>
|
||||
Holder.addTheme('gray', {
|
||||
bg: '#777',
|
||||
fg: 'rgba(255,255,255,.75)',
|
||||
|
||||
Reference in New Issue
Block a user