コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > htmlチュートリアル > 本文

単純な div フローティング問題について質問する_html/css_WEB-ITnose

WBOY
リリース： 2016-06-24 11:38:47
オリジナル
1084 人が閲覧しました

CSS float を学習したところですが、2 番目の div を最初の div の右側に配置し、3 番目の div を最初の div の下に配置したいと考えています。コードは次のとおりですが、3 番目の div が表示されて 2 番目の div を覆います。 、 なぜ？ 

<body>	<div id="div_1" style="float:left">    风风风风风风风f风    </div>    	<div id="div_2">    火火火火火火火火    </div>    	<div id="div_3">    水水水水水水水水    </div></body>
ログイン後にコピー


結果显示：


回复讨论(解决方案)

给#div_2也加个左浮動吧

给#div_2也加个左浮動吧


给div_2加了左浮動後で、3 番目の div の境界線と背景が消えていることに気づきました...


#div_2 に left float を追加しましょう


div_2 に left float を追加した後、3 番目の div の境界線と背景が消えていることがわかりました。 3 番目の div は消えました...
1 番目と 2 番目のフロートが残りました
3 番目の div は両方ともクリアされました
関連ラベル：
求问一个简单的div浮动问题
ソース：php.cn
前の記事：アニメーションアニメーション AlphaAnimation(透明度変更)_html/css_WEB-ITnose 次の記事：css3_html/css_WEB-ITnose の背景の新しい属性
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
無効な React 子要素 (見つかった: キー {clientVersion} を持つオブジェクト)。子要素のコレクションをレンダリングする場合は、代わりに配列を使用してください 複数ステップのフォームを持っているのですが、送信しようとするとこのエラーが表示されます。ただし、createOrganization スケジュールを単純な形式で使用すると、機能しま...
から 2024-04-06 16:25:39
0
1
346
JavaScript 関数はボタンのクリックには影響しません インターネットを検索して多くのことを試しましたが、比較的単純な問題で立ち往生しています。以下のコードは私の質問の全範囲です <script> //最終的に行全体を別のテ...
から 2024-04-05 13:14:53
0
2
1433
SQL クエリが Node.js の特定のルートに表示されない JavaScriptとnodejsは初めてで、質問があります。単純なAPIで作業しているコードがありますが、なぜこれが起こっているのか理解するのに苦労しています app.get('...
から 2024-04-04 00:24:22
0
1
344
質問は同じですが、タイトルは次のように書き換えられています: Javascript のランダム関数が有効な応答を生成できません JSとHTMLを使用して簡単な乱数生成ゲームを作成しています。このゲームでは乱数の最小値と最大値を設定できます。しかし、変数を設定して結果を記録すると、ありえない数値が表示されます...
から 2024-04-03 22:03:14
0
1
275
Chrome での HTML Web ページのページネーション フルページの div コンテナの後にページネーションしようとしています。紹介ページを読み込むのと同じように、下にスクロールすると、一種のナビゲーション センターに入ることができます...
から 2024-04-02 23:26:08
0
1
404
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート