0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-04 16:24:22 +01:00
Bootstrap/site/content/docs/5.1/utilities/visibility.md
2021-08-04 18:41:51 +03:00

38 lines
1.0 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

---
layout: docs
title: Visibility
description: Control the visibility of elements, without modifying their display, with visibility utilities.
group: utilities
---
Set the `visibility` of elements with our visibility utilities. These utility classes do not modify the `display` value at all and do not affect layout `.invisible` elements still take up space in the page.
{{< callout warning >}}
Elements with the `.invisible` class will be hidden *both* visually and for assistive technology/screen reader users.
{{< /callout >}}
Apply `.visible` or `.invisible` as needed.
```html
<div class="visible">...</div>
<div class="invisible">...</div>
```
```scss
// Class
.visible {
visibility: visible !important;
}
.invisible {
visibility: hidden !important;
}
```
## Sass
### Utilities API
Visibility utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
{{< scss-docs name="utils-visibility" file="scss/_utilities.scss" >}}