ホームページ  >  記事  >  ウェブフロントエンド  >  CSSでクリアを使う方法

CSSでクリアを使う方法

下次还敢
下次还敢オリジナル
2024-04-26 13:00:24433ブラウズ

clear 属性を使用すると、要素がフローティング フローから離れることができます。つまり、フロートをクリアできます。その使用法は次のとおりです。 left: 左側のフローティング要素をクリアします。 right: 右のフローティング要素をクリアします。 Both: すべてのフローティング要素をクリアします。

CSSでクリアを使う方法

CSS での clear の使用

##clear 属性の役割 ##clear 属性により、要素はフロート要素からエスケープできます。float 要素によって作成された float フローは、クリアされる float です。

Usage

clear 属性には 2 つの主な値があります。

    left:
  • 要素 浮動要素。
  • right:
  • 要素の右側にあるフローティング要素をクリアします。
  • #アプリケーション例

<code class="css">/* 清除左侧的浮动元素 */
.container {
  clear: left;
}

/* 清除右侧的浮动元素 */
.container {
  clear: right;
}

/* 清除所有浮动元素 */
.container {
  clear: both;
}</code>
いつ使用するか

cle 属性は、通常、次の状況で使用されます。

フローティング要素によりテキストまたはその他のコンテンツが折り返される場合。

    フローティング要素の隣に要素を配置したい場合。
  • 複数列の浮動要素をクリアしたい場合。
  • #注意

clear 属性は、現在の要素とその子孫要素の位置にのみ影響します。

clear 属性は、ブロック レベル要素にはフローティングされていないため、適用されません。
  • 要素の親要素に float 属性が設定されている場合、その要素は clear 属性を使用できません。この場合、最初に親要素の float をクリアする必要があります。

以上がCSSでクリアを使う方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。