Rumah > hujung hadapan web > html tutorial > 请教这里为什么需要用上浮动!_html/css_WEB-ITnose

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

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-06-24 11:54:57
asal
1220 orang telah melayarinya




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

<!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="/static/imghw/default1.png"  data-src="gg.jpg"  class="lazy"   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> 
Salin selepas log masuk


回复讨论(解决方案)

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

你写了2个 .s

不用浮动也可以啊

不用浮动也可以啊

不浮动是出不来的
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan