CSS3

プロパティ

content-visibility

→●、mdn

要素内容だけ隠す／表示。

content-visibility プロパティは、要素は自身の内容すべてを描画するかしないかを制御する。それは、一連の強い封じ込めを強制するとともに、［巨大な一帯を成す［レイアウト／描画］の作業を、必要なるまで省略可能にする］ことを、ユーザー エージェントに許容する。

各種 値の意味は：

visible

効果なし ― 要素の内容は、通常どおりレイアウトされ描画される。

開始<SPAN style="border:1px solid red;
 content-visibility:visible;
">テスト</SPAN>終了

開始<DIV style="border:1px solid red;
 content-visibility:visible;
">テスト</DIV>終了

hidden

要素の内容を飛ばす。

飛ばされた内容は、次を可能にしないものとする ：

選択する／
フォーカスする／
ユーザーエージェントのページ内検索やタブキーによる巡回, 等々の特能からアクセスする

注記： これは、内容に display: none を与えるのに類似する。

開始<SPAN style="border:1px solid red;
 content-visibility:hidden;
">テスト</SPAN>終了

開始<DIV style="border:1px solid red;
 content-visibility:hidden;
">テスト</DIV>終了

auto

要素の［レイアウト封じ込め、スタイル封じ込め、塗り封じ込め］をオンにする。

要素は利用者に関連しない場合、内容も飛ばす。

hidden と違って、飛ばされた内容であっても、通常どおり次を可能にするものとする ：

選択する／
フォーカスする／
ユーザー エージェント のページ内検索やタブ キーによる巡回、等々の特能から可用にする

開始<SPAN style="border:1px solid red;
 content-visibility:auto;
">テスト</SPAN>終了

開始<DIV style="border:1px solid red;
 content-visibility:auto;
">テスト</DIV>終了

¶以下省く

テスト