css子元素清除定位

CSS中的子元素清除定位，通常是指当父元素设置了`position: relative;`、`absolute;` 或 `fixed;` 等定位属性时，为了防止子元素也受到定位影响并保持正常文档流布局，需要对子元素的`position`属性进行处理。

主要有以下几种常见方法：

1. **设置`position: static;`**：这是最直接的方式，将子元素的定位属性设回默认值，让它按照正常的文档流排列。

.parent {
  position: relative;
}

.child {
  position: static;
}

2. **使用`position: relative;`并添加负边距**：如果希望保留子元素的相对位置，可以给子元素设置相同的上下外边距，使其与未定位时的位置对齐。

.parent {
  position: relative;
}

.child {
  position: relative;
  top: -parent-element-margin-top;
  bottom: -parent-element-margin-bottom;
}

3. **使用`clear`属性**：通过设置`.child { clear: both; }`可以让子元素下面的内容开始新的一行，避免与定位后的父元素重叠。

4. **利用伪元素`::before`或`::after`**：如果子元素内容上方有空白区域，可以用伪元素清除浮动效果。

.parent::before,
.child {
  content: "";
  display: table;
  clear: both;
}

记住，每种方法的选择取决于具体的布局需求。