ホームページ > 記事 > ウェブフロントエンド > ここでなぜ float が必要なのか教えてください。 _html/css_WEB-ITnose
ここでなぜ float が必要なのか教えてください。 _html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-24 11:54:571137ブラウズ
このコードで float を使用する必要があるのはなぜですか?エレメントを浮かさないと抜けないのですが、このような使い方をしているのでしょうか？マスターに指摘してもらいましょう
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>模仿京东</title> </head><style type="text/css" media="screen">*{ margin: 0px; padding: 0px;} .top{ width:100%; height: 30px; background: #eee; } #ad{ margin: 0 auto; display:block; margin-top: 10px; } .sousuo{ width: 1210px; height: 90px; background: #1f5aa8; margin: 0 auto; margin-top: 10px; } .daohang{ width: 1210px; height: 40px; background: #666; margin: 0 auto; margin-top: 10px; } .main{ height: 410px; width: 1210px; border: 2px solid orange; margin: 10px auto; } .main .zuobian{ background: #DB7093; height: 410px; width: 209px; float: left; } .zhongjian{ width: 690px; height: 410px; float: left; /*margin:2px;*/ background: #D8BFD8; } .zhongs{ width: 671px; height: 240px; background: red; margin-left:10px; } .zhongx{ width: 671px; height: 150px; background:#0096ff; margin-left: 10px; }.youbian{ height: 410px; width: 310px; background: #315a63; float: left;}.youbian .s{ height: 70px; width: 310px; background: #1223a3;float: left; }.youbian .s{height: 133px;width: 310px;background: #616351; float: left;}.youbian .z{ height: 137px; width: 310px; background: #0096ff; float: left;}.youbian .x { height: 137px; width: 310px; background: #e4e4e4; float: left;}</style> <body><!-- 顶部开始 --> <div class="top"> </div><!-- 顶部结束 --><!-- 广告开始 --><img src="gg.jpg" alt="我是广告哈哈哈哈" id="ad"><!-- 广告结束 --><!-- sousuo的部位 --><div class="sousuo"> </div><!-- sousuo结束 --><!-- 导航开始 --><div class="daohang"> </div><!-- 导航结束 --><div class="main"> <div class="zuobian"> </div> <div class="zhongjian"> <div class="zhongs"></div> <div class="zhongx"></div> </div> <div class="youbian"> <div class="s"></div> <div class="z"></div> <div class="x"></div> </div></div> </body> </html> E
返信 ディスカッション (解決策)
高さ: 70px;
幅: 310px;
背景:#1223a3;フロート: 左。
; }
2 .s を書きました
浮かなくても大丈夫です
浮かなくても大丈夫です
浮かなければ抜け出せません
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。