激活相关情况

使用相对位置来移动元素相对于其正常位置的位置。

相对定位的元素相对于其默认位置进行定位 — 围绕自身旋转。具有相对定位的元素提供了放置的可能性,同时在 document 流中保持其初始位置不变。

为元素分配相对位置后,您可以使用相对于其顶部、底部、左侧或右侧起点的值。此外,您还可以选择修改其 z-index 值。

本教程概述:

  1. 元素的叠加
  2. 元素的从属位置

元素的叠加

  1. 选择您想要叠加的元素
  2. 创建定制类(例如“特殊”)
  3. 将定位设置为相对(这将启用 z-index 调整)
  4. 现在,你可以独立于其他元素改变位置,使其出现在默认内容的前面

元素的从属位置

  1. 选择要放置在下方的元素
  2. 生成自定义类(例如“super”)
  3. 应用相对定位(以启用 z-index 自定义)
  4. 分配一个数值(在此特定场景中大于 0)
  5. 在前面的步骤中,为元素分配一个更高或更低的值,以将其放置在顶部或后面

相对定位使您能够根据元素的原始位置来定位元素,而不受页面上周围内容的影响。

麦宜云
Ewan Mak 的最新帖子 (查看全部)