Menu Riverview Church

CONTENT-VISIBILITY

The content-visibility property controls whether or not an element renders its contents at all, along with forcing a strong set of containments, allowing user agents to potentially omit large swathes of layout and rendering work until it becomes needed.

SYNTAX

CSS

content-visibility: value;

JS

object.style.contentVisibility = "value";

VALUES

<'content-visibility'> = visible | auto | hidden
visible

No effect. The element's contents are laid out and rendered as normal.

auto

The element turns on layout containment, style containment, and paint containment. If the element is not relevant to the user, it also skips its contents. Unlike hidden, the skipped contents must still be available as normal to user-agent features such as find-in-page, tab order navigation, etc., and must be focusable and selectable as normal.

hidden

The element skips its contents. The skipped contents must not be accessible to user-agent features, such as find-in-page, tab-order navigation, etc., nor be selectable or focusable. Note: This is similar to giving the contents display: none.

INITIAL

visible

EXAMPLES

VISIBLE

AUTO

HIDDEN

JS

World Wide Web Consortium (W3C)