父元素设置绝对定位，子元素如何保持正常流？

偷偷努力，悄无声息地变强，然后惊艳所有人！哈哈，小伙伴们又来学习啦~今天我将给大家介绍《父元素设置绝对定位，子元素如何保持正常流？ 》，这篇文章主要会讲到等等知识点，不知道大家对其都有多少了解，下面我们就一起来看一吧！当然，非常希望大家能多多评论，给出合理的建议，我们一起学习，一起进步！

scss嵌套式元素继承父元素属性的消除

对于您的问题，“当父元素设置绝对定位时，子元素如何保持正常流”，答案的关键在于解决css样式继承中的隐式污染问题。

css样式继承具有隐式性，这意味着如果某元素未定义特定属性，它将从其父元素继承该属性。在您的scss示例中，子元素.hide未设置position属性，因此它继承了父元素.action的position:absolute值。

要消除这种继承，需要明确为子元素设置position值。您可以将.hide的position设置为static，如下所示：

#action {
  ...

  .hide {
    position: static;
    width: 40px;
    height: 100%;
    background-color: orange;
  }
}

通过指定position:static，您指示浏览器将子元素视为正常流的一部分，而不是绝对定位的。这样，子元素将不受父元素定位属性的影响。

今天关于《父元素设置绝对定位，子元素如何保持正常流？ 》的内容就介绍到这里了，是不是学起来一目了然！想要了解更多关于的内容请关注golang学习网公众号！