overflow属性

表示内容超出了元素的宽度或者高度之后,应该怎么办。是隐藏还是出现滚动条让用户滑动。

其实,使用overflow : hidden也能清除浮动,示例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        .left {
            background-color : red;
            display : inline-block;
            float   : left;
        }
        .right {
            background-color : blue;
            display : inline-block;
            float   : right;
        }
        .clear-float {
            background-color : green;
            overflow : hidden;
        }
    </style>
</head>
<body>
    <div class='clear-float'>
        <div class='left'>left</div>
        <div class='right'>right</div>
    </div>
    <p>我不受影响</p>
</body>
</html>