css中常见的有哪几种浮动方法

CSS中浮动是一种常见的布局方法，它可以将元素从文档流中取出，并使它沿着容器的左侧或右侧浮动为容器的一部分。常见的浮动方法有以下几种：

.float-left {
  float: left;
}
.float-right {
  float: right;
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
} 

首先，我们可以使用float: left;将元素向左浮动。浮动在其容器中向左对齐，其余内容将流动到它的右侧。这通常用于制作多列布局。

还可以使用float: right;将元素向右浮动。浮动在其容器中向右对齐，其余内容将流动到它的左侧。这种方法常用于实现网页导航条和侧边栏 。

然而，使用浮动布局（尤其是使用多个浮动元素）可能会导致包含块高度塌陷，因此需要使用辅助方法来清除浮动。清除浮动通常使用一个clearfix类，其中包含一个伪元素，如下所示：

<div class="clearfix">
  <div class="float-left">浮动元素1</div>
  <div class="float-left">浮动元素2</div>
  <div class="float-left">浮动元素3</div>
</div> 

在这个示例中，我们在外层包裹一个具有clearfix类的元素，并在元素之间使用float: left;。然后，我们使用::after伪元素清除浮动，使包含块正常显示。这是一个常见的技巧，使浮动元素能够与其他元素正确对齐。

这里介绍的这几种浮动方法是比较常见的。使用好它们可以为页面提供更具吸引力的布局效果。