<ul>
<li>首頁</li>
<li>課程中心
<ul>
<li>Web前段
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
<li>jQuery</li>
</ul>
</li>
<li>Android開發</li>
<li>PHP開發</li>
</ul>
</li>
</ul>
<li>首頁</li>
<li>課程中心
<ul>
<li>Web前段
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
<li>jQuery</li>
</ul>
</li>
<li>Android開發</li>
<li>PHP開發</li>
</ul>
</li>
</ul>
對于nav會不能夠完全在一行顯示的原因是img本身是行內元素,如果直接在div內寫img外,而不另外給img設置寬高,會導致整個圖片實際的高度會多出來3px,解決辦法:第一種:給img變成塊元素,并且給img設置成與圖片一樣的高度,這樣既可避免溢出;第二種:不就是溢出了嘛,直接給logo加上overflow:hidden,即可。
2017-07-31
.mainbox{width:960px;height:300px;background-color:#CFF;float:left;}
.leftbox{ width:740px;height:300px;background-color:#C9F;float:left;}
.rightbox{width:210px;height:300px;background-color:#FCF;float:right; }
<div class="mainbox">
<div class="leftbox"></div>
<div class="rightbox"></div>
</div>
.leftbox{ width:740px;height:300px;background-color:#C9F;float:left;}
.rightbox{width:210px;height:300px;background-color:#FCF;float:right; }
<div class="mainbox">
<div class="leftbox"></div>
<div class="rightbox"></div>
</div>