z-index値を適用する - Webflowヘルプ

Last updated on 10/26/2025@mrbirddev
z-index値を適用する - Webflowヘルプ

z-index値を使って重なった要素を順序付ける

z-indexで要素を重ねる - ウェブデザインチュートリアル(旧UI使用)

z-index値とは何か

z-index値は要素の重なり順を制御します。

  • z-index値が高い要素は、低い値の要素の上に重なります。
  • 子要素は親要素に従ってのみ重なります。(例:要素Aが要素Bより高いz-indexを持つ場合、要素Bの子要素は決して要素Aを重ねません。)
  • z-indexは相対、絶対、固定の位置指定でのみ機能します。
  • デフォルトのz-index値は0です。

z-index値を使って要素を重ねる

  • 配置したいdivブロックを選択します。
  • z-index値を適用します(デフォルトのz-index値は0なので、0より大きい値を設定すると要素が上に配置されます)。
  • 高い値は低い値の上に重なります。
  • 負の値は要素を消してしまうことがあります。
負のz-index値は他の要素の後ろに要素を消してしまうことがあります。注意して使用してください!

Webflowヘルプに戻る

Last updated on 10/26/2025@mrbirddev
Recent Articles
Loading...