BFCコンセプト: ブロック フォーマット コンテキストは、BFC 内の要素を外部の要素から分離する独立したレンダリング領域であり、内部要素と外部要素の配置が相互に影響を与えないようにします。 まず、「BFC (ブロック フォーマット コンテキスト)」という用語を理解しましょう。これは中国語で「ブロック レベル フォーマット コンテキスト」を意味します。 まず、原則を覚えておいてください。要素に BFC がある場合、内部要素がどのように変化しても、外部要素には影響しません。したがって、BFC 要素にマージンの重なりを持たせることはできません。マージンの重なりは外側の要素に影響を与えるからです。また、BFC 要素はフローティングの影響をクリアするためにも使用できます。クリアしないと、子要素のフローティングによって親要素の高さが崩れ、後続の要素のレイアウトと配置に必然的に影響します。これは明らかに、BFC 要素の子要素が外部の要素に影響を与えないという設定に反します。 次の状況では BFC がトリガーされます。 • <html> ルート要素 当然ですが、オーバーフロー値を hidden に設定し、コンテナ要素に BFC を持たせると、子要素 child のフローティングによって親要素の高さが崩れることはありません。 疑似クラス要素を使用してフローティングをクリアします。 .clearFix::after、.clearFix::before { 表示: ブロック; コンテンツ: ''; クリア: 両方; 可視性: 非表示; 高さ: 0; } .clearFix { ズーム: 1;} 要約する 上記は、私が紹介した疑似要素を使用してフローティングをクリアする CSS メソッドです。お役に立てば幸いです。ご質問がある場合は、メッセージを残してください。すぐに返信します。 |
<<: IIS を使用して X-Forwarded-For ヘッダー (XFF) を呼び出して訪問者の実際の IP を記録する 2 つの方法
>>: Web デザインの経験: 独善的な Web デザイナー
製造手順を分析します。 1. リソースを準備してシーンを構築するオンラインでリソースを探すか、私のリ...
解決策は次のとおりです。 1. コンテナを強制削除する docker rm -f ジェンキンス2. ...
この記事はmysql8.0.0 winx64.zip解凍版のインストールチュートリアルを記録していま...
インターネット上のインストール情報は不均一で、落とし穴だらけです。インストールにはかなりの労力がかか...
目次序文Ajax シリアルおよびパラレルAjaxの同時リクエスト制御のための2つのソリューションPr...
wxsとは何ですか? wxs (WeiXin Script) は、小規模プログラム用のスクリプト言語...
この記事では、例を使用して、MySQL ビューの作成 (CREATE VIEW) と使用上の制限につ...
目次解決: 1. 無視する2. 交換する3. 重複キーの更新についてデータを挿入するときに、重複した...
目次序文XA プロトコルMySQL XA で分散トランザクションを実装する方法序文MySQL が単一...
目次1. トリガーの紹介1. トリガーとは何ですか? 2. トリガーの特徴2. トリガーを作成する1...
本日、開発中に、顧客からページをキャッシュしないように要求される方法に遭遇しました。調べたところ、ペ...
目次レイアウトを作成するCSSスタイルを追加するJavaScript で要素を操作する対象要素を取得...
mysql-5.7.17-winx64 は MySQL の最新バージョンです。インストールは無料で...
<br />このページでは、テーブルをネストすることで組版を実現しています。つまり、1 ...
1: dockerにmongodbをインストールするステップ1: dockerにmongodbをイン...