clear、overflow、after伪元素

clear、、after伪元素都是CSS中的伪元素，用于控制元素的样式和布局。

clear伪元素用于清除浮动元素对其父元素的影响，常用的属性值有：left、right、both。

overflow伪元素用于控制元素内容的溢出情况，常用的属性值有：hidden、scroll、auto。

after伪元素用于在元素的内容后面插入一个空的内容框，可以用于清除浮动等特殊需求，常用的属性有：content、display、clear等。

相关问题

清除浮动方法？ 解释 clear、overflow、after伪元素

清除浮动主要是为了解决父元素因为子元素浮动而导致高度塌陷的问题。常见的解决办法有：使用clear属性、给包含子元素的父元素添加overflow属性，以及使用after伪元素。

clear属性可以取值为left、right、both或none，它可以让元素的上下文环境从前面的浮动元素中恢复过来。设置为left或right时，会清除相应方向上的浮动；设置为both时，会清除两个方向上的浮动；设置为none时，则不清除任何浮动。

overflow属性可以取值为hidden、auto或scroll，它可以在包含浮动子元素的块级元素上创建一个新的BFC，并在此BFC的范围内包含浮动子元素。这样可以使父元素自适应子元素的高度。

after伪元素通常与clear属性配合使用。在父元素上添加一个after伪元素，并设置clear属性，可以使该伪元素作为新的块级元素，位于父元素内部，从而清除父元素的浮动。同时，该伪元素不会影响文档的结构和样式。

清除浮动方法？ clear、overflow、after伪元素

等方式可以清除浮动。其中比较常用的是after伪元素方法，可以通过在父元素上设置::after伪元素，并在伪元素中设置clear:both;来清除浮动。如下所示：

.parent::after {
  content: "";
  display: table;
  clear: both;
}