ホームページ > 記事 > ウェブフロントエンド > div が right_html/css_WEB-ITnose にフローティングした後にラップされるのはなぜですか
div が right_html/css_WEB-ITnose にフローティングした後にラップされるのはなぜですか
- WBOYオリジナル
- 2016-06-24 11:31:441736ブラウズ
div が右にフローティングされた後、別の行に折り返されるのはなぜですか:
提案: コードをできるだけ手書きします。これにより、学習の効率と深さが効果的に向上します。
2 つの div を同じ行に配置する方法はたくさんあります。初心者の中には、これで効果が得られると考えて、左側の div はフローティングせず、右側の div は右側にフローティングするように書く人もいるかもしれません。同じ行にある 2 つの div ですが、そうではありません。コードは次のとおりです:
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>蚂蚁部落</title><style type="text/css">.left{ width:200px; height:200px; background-color:blue;}.right{ width:200px; height:200px; background-color:red; float:right;}</style></head><body><div class="left"></div><div class="right"></div></body></html> したがって、2 つの div を同じ行に配置したい場合は、両方の div をフローティングにする必要があります。コードは次のとおりです:
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>蚂蚁部落</title><style type="text/css">.left{ width:200px; height:200px; float:right; background-color:blue;}.right{ width:200px; height:200px; background-color:red; float:right;}</style></head><body><div class="left"></div><div class="right"></div></body></html> 元のアドレスは次のとおりです: http://www.softwhy.com/forum.php?mod=viewthread&tid=4659
詳細については、次を参照してください: http://www .softwhy.com/divcss /
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。