content-visibility
Description
The content-visibility property for CSS 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
