Visibility / Opacity

Utilities for controlling the opacity of an element.

Opacity

Applies to: VisualElement

You can apply the following classes to change to opacity of an element.

Class

Properties

.o-0

opacity: 0; (invisible)

.o-10

opacity: .1;

.o-20

opacity: .2;

.o-30

opacity: .3;

.o-40

opacity: .4;

.o-50

opacity: .5;

.o-60

opacity: .6;

.o-70

opacity: .7;

.o-80

opacity: .8;

.o-90

opacity: .9;

Visibility

Applies to VisualElement

The following classes can be used to show/hide an element.

Class

Property

Notes

.visible

visibility: visible;

.invisible

visibility: hidden;

Do not display the element, but reserve space for the element in layout.

.collapse

visibility: collapse;

Do not display the element, and do not reserve space for it in layout.