mirror of
https://github.com/twbs/bootstrap.git
synced 2024-12-13 01:08:58 +01:00
a816615efa
* Add responsive utility classes for opacity - fix for #33483 * remove responsive opacity utils as it has impact on bootstrap.css bundle size * Update opacity.md * Update site/content/docs/5.0/utilities/opacity.md Co-authored-by: Mark Otto <otto@github.com> * Update site/content/docs/5.0/utilities/opacity.md Co-authored-by: Mark Otto <otto@github.com> Co-authored-by: Harish <halodoc@ip-192-168-1-101.ap-southeast-1.compute.internal> Co-authored-by: XhmikosR <xhmikosr@gmail.com> Co-authored-by: Mark Otto <otto@github.com> Co-authored-by: Mark Otto <markd.otto@gmail.com> Co-authored-by: alpadev <2838324+alpadev@users.noreply.github.com>
1.1 KiB
1.1 KiB
layout | title | description | group |
---|---|---|---|
docs | Opacity | Control the opacity of elements. | utilities |
The opacity
property sets the opacity level for an element. The opacity level describes the transparency level, where 1
is not transparent at all, .5
is 50% visible, and 0
is completely transparent.
Set the opacity
of an element using .opacity-{value}
utilities.
100%
75%
50%
25%
<div class="opacity-100">...</div>
<div class="opacity-75">...</div>
<div class="opacity-50">...</div>
<div class="opacity-25">...</div>
Utilities API
Opacity 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-opacity" file="scss/_utilities.scss" >}}