帮看 一个 绝对定位的 偏移属性 如果是相对于 content box而言的话 该如何设置的问题?

作者站长头像
站长
· 阅读数 16

背景

https://blog.csdn.net/weixin_44350171/article/details/111076594

绝对定位的偏移属性 top left right 都是相对于 包含块的 paddingbox的外边缘而言的。

问题

如果我想实现 绝对定位元素位于 padding box的右上角。

帮看 一个  绝对定位的   偏移属性 如果是相对于 content box而言的话 该如何设置的问题?

  1. 如果 绝对定位的偏移属性 top left right 是相对于 包含块的 paddingbox的外边缘而言的。则如下设置
.list {
  padding: 1rem;
}
.tag {
  position: absolute;
  top: 0;
  right: 0;
}
  1. 如果 绝对定位的偏移属性 top left right 是相对于 包含块的 content box的外边缘而言的。
.list {
  padding: 1rem;
}
.tag {
  position: absolute;
  top:  xxx;
  right: xxx;
}

这个top和right 是-1rem 还是1rem?

个人理解: 应该是-1rem吧,毕竟top--->中心位置是向下为正,而这里显然是从content box的右上角往上移动,所以是-1rem

回复
1个回答
avatar
test
2024-06-19

第2个“如果”不存在。绝对定位的偏移属性 top left right 是相对于父块级元素(严格说是最近的非static的块)的border距离而言。

第2个“如果” 如果存在,如你所说,实现tag紧贴右上角停放,是要用 -1rem 才能实现

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容