亚洲视频二区_亚洲欧洲日本天天堂在线观看_日韩一区二区在线观看_中文字幕不卡一区

css 清除屬性 (clear) 用來控制元素與浮動元素的關系，確保非浮動元素不會流到浮動元素下方。用法如下：none：不清除浮動left：清除左側(cè)浮動right：清除右側(cè)浮動both：清除左右浮動

CSS 中 clear 屬性的作用

clear 屬性用于控制一個元素與浮動元素之間的關系，確保非浮動元素不會流到浮動元素的下方。

用法

<code class="&lt;a style='color:#f60; text-decoration:underline;' href=" https: target="_blank">css"&gt;clear: none | left | right | both;</code>

登錄后復制

none：默認值，不清除浮動。

left：清除左側(cè)的浮動元素。

right：清除右側(cè)的浮動元素。

both：清除左右兩側(cè)的浮動元素。

作用

當元素浮動時，它們會被置于文檔流之外，后面的非浮動元素會流到浮動元素的下方。clear 屬性通過設置非浮動元素的 clear 值，使其強制在浮動元素的上方開始。

例如，以下代碼將確保段落元素不會流到浮動圖像的下方：

<code class="css">p {
  clear: both;
}</code>

登錄后復制

示例

假設有以下 HTML 代碼：

<code class="html"><div class="container">
  <div class="image float-left"></div>
  <p>段落</p>
</div></code>

登錄后復制

如果未設置 clear 屬性，段落元素將流到圖像元素的下方，導致布局混亂。

通過設置 clear 屬性，可以確保段落元素在圖像元素的上方開始：

<code class="css">.container {
  width: 500px;
}

.image {
  float: left;
  width: 200px;
  height: 200px;
  background: #f00;
}

p {
  clear: both;
}</code>

登錄后復制

在此示例中，段落元素強制在圖像元素的上方開始，從而使布局清晰明了。