Heim >Web-Frontend >HTML-Tutorial >请教这里为什么需要用上浮动!_html/css_WEB-ITnose

请教这里为什么需要用上浮动!_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:54:571172Durchsuche




代码这为什么需要用上浮动?不用浮动元素出不来,我这样用对吗?请教各位高手指点一下说详细点

<!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> 


回复讨论(解决方案)

 
.youbian .s{
 
         
        height: 70px;
        width: 310px;
        background: #1223a3;
float: left;
          
}
 
 
 
.youbian .s{
 
height: 133px;
width: 310px;
background: #616351;
 float: left;
}
 

你写了2个 .s

不用浮动也可以啊

不用浮动也可以啊

不浮动是出不来的
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn