【CSS】清除浮动

六碗铁biu_

于 2019-08-27 13:11:16 发布

阅读量149

点赞数

分类专栏：【**CSS**】文章标签： css

本文链接：https://blog.youkuaiyun.com/qq_30042269/article/details/100097181

版权

【**CSS**】专栏收录该内容

3 篇文章

订阅专栏

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>清除浮动</title>
    <style>
      .box {
        padding: 1px;
        background-color: rebeccapurple;
      }

      .img {
        float: left;
      }

      .clearx:after {
        content: '';
        display: block;
        height: 0;
        visibility: hidden;
        clear: both;
      }

      .clearx {
        *zoom: 1;
      }
    </style>
  </head>
  <body>
    <div class="box clearx ">
      <img
        class="img"
        src="http://img1.qunarzz.com/sight/p0/201404/23/04b92c99462687fa1ba45c1b5ba4ad77.jpg_600x330_bf9c4904.jpg"
      />
    </div>
  </body>
</html>

效果：