啟動相對情況

使用相對位置將元素相對於其正常位置移動。

相對定位的元素相對於它們的預設位置定位——圍繞它們自身旋轉。具有相對定位的元素提供了放置的可能性,同時在 document 流程中保持其初始位置完整。

為元素指派相對位置後,您可以使用相對於其起點的值作為頂部、底部、左側或右側。此外,您可以選擇修改其 z-index 值。

本教學概述:

  1. 元素的疊加
  2. 元素的從屬放置

元素的疊加

  1. 選擇您想要覆蓋的元素
  2. 建立自訂類別(例如“特殊”)
  3. 將定位設為相對(這將啟用 z 索引調整)
  4. 現在,您可以獨立於其他元素更改位置,使其出現在預設內容的前面

元素的從屬放置

  1. 選擇要放置在下方的元素
  2. 產生自訂類別(例如“super”)
  3. 應用相對定位(以啟用 z-index 自訂)
  4. 分配一個數值(在這個特定場景中大於 0)
  5. 在上一步中,為元素分配一個更高或更低的值,以將其放置在頂部或後面

相對定位使您能夠獨立於頁面上周圍的內容相對於其原始位置來定位元素。

麥伊凡
Ewan Mak 的最新帖子 (看全部)