rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-28 20:52:21 +01:00
Code Issues Actions Packages Releases Activity

formatting

Browse Source
This commit is contained in:
Andrew Murphy 2017-10-19 21:22:40 +01:00 committed by GitHub
parent 8504f68815
commit b69d535822
1 changed files with 17 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
docs/4.0/utilities/display.md
View File

@ -55,18 +55,18 @@ To show an element only on a given interval of screen sizes you can combine one
| Screen Size | Class |
| --- | --- |
| Hidden on all | `d-none` |
| Hidden only on xs | `d-none d-sm-block` |
| Hidden only on sm | `d-sm-none d-md-block` |
| Hidden only on md | `d-md-none d-lg-block` |
| Hidden only on lg | `d-lg-none d-xl-block` |
| Hidden only on xl | `d-xl-none` |
| Visible on all | `d-block` |
| Visible only on xs | `d-block d-sm-none` |
| Visible only on sm | `d-none d-sm-block d-md-none` |
| Visible only on md | `d-none d-md-block d-lg-none` |
| Visible only on lg | `d-none d-lg-block d-xl-none` |
| Visible only on xl | `d-none d-xl-block` |
| Hidden on all | `.d-none` |
| Hidden only on xs | `.d-none .d-sm-block` |
| Hidden only on sm | `.d-sm-none .d-md-block` |
| Hidden only on md | `.d-md-none .d-lg-block` |
| Hidden only on lg | `.d-lg-none .d-xl-block` |
| Hidden only on xl | `.d-xl-none` |
| Visible on all | `.d-block` |
| Visible only on xs | `.d-block .d-sm-none` |
| Visible only on sm | `.d-none .d-sm-block .d-md-none` |
| Visible only on md | `.d-none .d-md-block .d-lg-none` |
| Visible only on lg | `.d-none .d-lg-block .d-xl-none` |
| Visible only on xl | `.d-none .d-xl-block` |
{% example html %}
<div class="d-lg-none">hide on screens wider than lg</div>
@ -79,10 +79,10 @@ Change the `display` value of elements when printing with our print display util
| Class | Print style |
| --- | --- |
| `.d-print-block` | Applies `display: block` to the element when printing |
| `.d-print-inline` | Applies `display: inline` to the element when printing |
| `.d-print-inline-block` | Applies `display: inline-block` to the element when printing |
| `.d-print-none` | Applies `display: none` to the element when printing |
| `.d-print-block` | Applies `display: block;` to the element when printing |
| `.d-print-inline` | Applies `display: inline;` to the element when printing |
| `.d-print-inline-block` | Applies `display: inline-block;` to the element when printing |
| `.d-print-none` | Applies `display: none;` to the element when printing |
The print and display classes can be combined.