Top layer (最上位レイヤー)

最上位レイヤーは、ビューポートの幅と高さ全体にわたり、ウェブ文書内に表示される他のすべてのレイヤーの最上位に位置する固有のレイヤーです。これは、ページ上の他のすべてのコンテンツの上に現れるべき要素を含むために、ブラウザーによって作成されます。

最上位レイヤーに配置された要素は新しい重ね合わせコンテキストを生成し、対応する ::backdrop 擬似要素も生成します。

最上位レイヤーに現れる要素は以下の通りです。

• 全画面要素、つまり Element.requestFullscreen() の呼び出しが成功して全画面モードで表示するように指定された要素。
• <dialog> 要素が、 HTMLDialogElement.showModal() の呼び出しに成功してモーダルとして表示された場合。
• HTMLElement.showPopover() の呼び出しに成功して表示されたポップオーバー要素。

Chrome などの一部のブラウザーでは、最上位レイヤーに配置された要素を特別な DOM ツリー項目の中に表示します。例えば、以下のようになります。

最上位レイヤーはブラウザー内部の概念であり、コードから直接操作することはできないことに注意してください。CSS や JavaScript を使用して最上位レイヤーに配置された要素を対象とすることはできますが、最上位レイヤー自体を対象とすることはできません。