clear

优质

小牛编辑

119浏览

2023-12-01

描述 (Description)

clear可防止元素显示在浮动元素旁边。

可能的值 (Possible Values)

none - 浮动元素可能出现在元素的任一侧。
left - 浮动元素可能不会出现在元素的左侧。
right - 浮动元素可能不会出现在元素的右侧。
both - 浮动元素可能不会出现在元素的两侧。

适用于 (Applies to)

所有块级元素。

DOM语法 (DOM Syntax)

object.style.clear = "top";

例子 (Example)

以下是显示此属性效果的示例 -

<html>
   <head>
      <style type = "text/css">
         div.float {
            border:1px solid #ff9900;
            width:120px;
            float: right;
         }
         div.clear {
            border:1px solid #cccccc;
            width:120px;
            clear: right;
         }
      </style>
   </head>
   <body>
      <div class = "float">
         This div has float set.
      </div>
      <div class = "clear">
         <p>
            This div has the CSS clear property set.
         </p>
         <p>
            Try changing the CSS clear values to see the effect it has on the position of the div boxes.
         </p>
      </div>
   </body>
</html>

这将产生以下结果 -