css - 如果 div 位置设置为 relative 并且 div :before position is set to absolute, 是 div :before positioned relative to div?

标签 css position

<分区>

我有一个我认为我知道但需要验证的问题。

如果我们有

<div class="parent">
  <p>ABC</p>
</div>

.parent
{
  position: relative;
  ...
  /* these two attributes prove that .parent:before is positioned relative to .parent */
  top: 50px;
  left: 50px;
}

.parent:before
{
  position: absolute;
  left: 0px;  
  ...
  content: "XYZ";
}

.parent:before 是相对于.parent 定位的吗?好像是这样。看看这个 jsfiddle:

https://jsfiddle.net/5oejdy2p/3/

我们从jfiddle可以看出,XYZ是相对于.parent定位的。因为.parent是相对定位的,

top: 50px;
left: 50px;

我们看到 XYZ 随 .parent 移动。

只需要验证我是正确的。

最佳答案

是的,你是对的。伪元素相对于父元素定位,如果定位为绝对。

因为伪元素是相对于父元素的内部元素

关于css - 如果 div 位置设置为 relative 并且 div :before position is set to absolute, 是 div :before positioned relative to div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57803474/

上一篇:javascript - 关闭模态框会重新加载页面

下一篇:html - 如何在灰色背景色的div上显示部分产品图片?

相关文章:

javascript - Bootstrap 选择不更改图标集

javascript - jquery-mobile:关闭桌面主题

html - Iframe 响应式高度和宽度适合内容

fonts - html5 : Input Field Using @fontface, 非系统字体。这可能吗

html - CSS 溢出 Firefox 问题

css - 修复了 Firefox 7.0.1 中的定位错误,一些溢出似乎导致固定 div 上的边距为 1px

html - css/position 主要内容 div 到登录和注册 div 的右侧

html - 固定定位元素不适应窗口/视口(viewport)的宽度

css - 当前位置:固定在IE 6/7/8和mozilla上工作

html - 无法移动带边距的文本