浮きを解消する方法まとめ

それらの無駄な方法は捨てて、最も実用的な方法だけを覚えてください!

float をクリアする必要がある親要素に

クラス属性をもう 1 つ追加します: clearfix! ！ ！ スタイルは次のとおりです:

:after

:".";

height:0;
ie6、ie7と互換性を持たせるため(現在のプロジェクトはほぼ完全に無視されます)
.clearfix{
zoom:1}

Clear floatは非常にシンプルなので、パブリックスタイルコモンとして使用できます。 css、各ページを直接呼び出すことができます。 簡単なアプリケーション例:

//sth

ページが乱雑だと思いますかそして重なっていますか？原因は浮きのせいだ！

2. 親要素の下にある子要素が float になると、親の高さの値が 0 になる可能性があります。そのため、float を使用した後、すぐに親に clearfix を追加して、float によって引き起こされるさまざまな問題を完全に排除します。

以上が浮きを解消する方法まとめの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル：

清除浮动 float

ソース：php.cn

前の記事：CSS 位置決めの使用の概要 次の記事：CSS3 背景画像の紹介 - 背景画像

このウェブサイトの声明

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

著者別の最新記事

• HTMLで太字、斜体、下線、取り消し線などのフォント効果を設定する例の紹介
  1970-01-01 08:00:00
• Java バージョンの Redis を実装する
  1970-01-01 08:00:00
• 最も単純な WeChat アプレットのデモ
  1970-01-01 08:00:00
• Pythonでのpandas.DataFrameの簡単な操作方法（作成、インデックス、追加、削除）の紹介
  1970-01-01 08:00:00
• WeChat ミニ プログラム: タブ効果の実装方法の例
  1970-01-01 08:00:00
• Python は辞書構造の出力を美しくするためのカスタム メソッドを構築します
  1970-01-01 08:00:00
• HTML5: Canvas を使用してビデオをリアルタイムで処理する
  1970-01-01 08:00:00
• Asp.net は SignalR を使用して画像を送信します
  1970-01-01 08:00:00
• WeChat ミニ プログラム開発チュートリアル - App() および Page() 関数の概要
  1970-01-01 08:00:00
• Python Redisの使い方を詳しく解説
  1970-01-01 08:00:00

最新の問題

function_exists() はカスタム関数を決定できません Function test () {return true;} if (function_exists ('test')) {echo "テストは関数です";

から 2024-04-29 11:01:01

0

3

2316

Google Chromeのモバイル版を表示する方法 こんにちは、先生、Google Chrome をモバイル版に変更するにはどうすればよいですか?

から 2024-04-23 00:22:19

0

11

2454

子ウィンドウは親ウィンドウを操作しますが、出力は応答しません。 最初の 2 つの文は実行可能ですが、最後の文は実装できません。

から 2024-04-19 15:37:47

0

1

2069

親ウィンドウには出力がありません document.onclick = function(){ window.opener.document.write('私は子ウィンドウの出力です');

から 2024-04-18 23:52:34

0

1

1955

CSS マインド マッピングに関するコースウェアはどこにありますか? コースウェア

から 2024-04-16 10:10:18

0

0

2023

関連トピック

詳細>

• readyfor4gb
• Javaでビデオを使用する方法
• OuYi Exchangeアプリのダウンロード
• スプライスの使用法
• Windows 8 コンピューターのパワーオン パスワードを忘れた場合の解決方法
• テキストを数値に変換する
• アプリのフルネーム
• コンピューターのウィンドウをアクティブ化する方法