                        課程
                    
                        /前端開發
                        
                            /HTML/CSS
                        
                        /企業網站綜合布局實戰

margin-top沒有效果，border-bottom消失，

<!DOCTYPE?HTML>
<html>
??<head>
????<meta?http-equiv="Content-Type"?content="text/html;?charset=gb2312">
????<title>無標題文檔</title>
??</head>
??<style>
??????*{padding:0px;margin:0px;list-style:none;font-size:14px;}
??????.all{width:1000px;margin:0?auto;background-color:white;}
??????.logo{width:1000px;height:70px;}
??????.logo_left,.logo_rigjt{float:left;}
??????.logo_right?li{float:left;width:80px;line-height:70px;text-align:center;margin:0?5px;}
??????.logo_right?li?a{display:block;text-decoration:none;font-family:"微軟雅黑";color:black;font-weight:bold;}
??????.logo_right?li?a:hover{background-color:#B22222;padding:0px?6px;}
??????#ad{width:1000px;height:310px;}
??????.line{width:1000px;margin-top:25px;height:50px;}
??????.line_left,.line_right{float:left;}
??????.line_left{width:145px;background-color:#B22222;text-align:center;padding:10px?0;color:white;}
??????.line_right{width:845px;background-color:#444444;padding:10px?0;color:white;padding-left:10px;}
??????.mid{width:1000px;}
??????.mid?li{float:left;margin-right:3px;}
??????.mid?li?p{text-align:center;border:1px?solid?#E8E8E8;height:25px;line-height:25px;}
??????.content{width:1000px;height:250px;padding-top:15px;overflow:hidden;}
??????.content_left,.content_mid,.content_right{float:left;width:328px;height:250px;border:1px?solid?#E8E8E8;}
??????.content_left,.content_mid{margin-right:3px;}
??????.content?.boxup{width:width:328px;background-color:#B22222;height:30px;
??????line-height:30px;padding-left:10px;color:white;}
??????.content?.date{width:30px;height:40px;float:left;background-color:#B22222;margin:4px?8px;font-size:13px;text-align:center;padding-top:5px;color:white;}
?????.content_left?.boxdown?.pp{margin:4px?4px;line-height:20px;}
?????.content_left?.boxdown?.pp?p,h3{font-size:12px;}
?????.content_mid?.boxdown{line-height:30px;margin:10px?10px;}
?????.content_right?.boxdown{line-height:20px;margin:10px?10px;font-size:10px;}
?????.bottom{width:1000px;text-align:center;height:35px;background-color:#DDDDDD;line-height:35px;font-weight:bold;font-size:12px;margin-top:10px;}
??</style>
??<body>
?<div?class="all">?
??????<div?class="logo">
?????????<div?class="logo_left">?<img?src="http://img1.sycdn.imooc.com//53edadad0001efe202000070.jpg"></div>
??????????<div?class="logo_right">?
??????????????<ul>
??????????????????<li><a?href="#">首頁</a></li>
??????????????????<li><a?href="#">產品特色</a></li>
??????????????????<li><a?href="#">解決方案</a></li>
??????????????????<li><a?href="#">產品價格</a></li>
??????????????????<li><a?href="#">幫助中心</a></li>
??????????????????<li><a?href="#">關于我們</a></li>
????????????</ul>
??????????</div>
??????</div>
??????<div?id="ad">
??????<div>
??????????<ul>
??????????????<li><a?href="a"><img?src="http://img1.sycdn.imooc.com//53edad3e0001afad10000318.jpg"></a></li>
??????????</ul>
??????????</div>
??????</div>
??????<div?class="line">
??????????<div?class="line_left">滾動新聞</div>
??????????<div?class="line_right">這是滾動新聞</div>
??????</div>
??????<div?class="mid">
??????????<ul>
??????????????<li><img?src="http://img1.sycdn.imooc.com//53edad54000119fb03300130.jpg"><p>玩轉bootstrap</p></li>
?????????????????<li><img?src="http://img1.sycdn.imooc.com//53edad690001260a03300130.jpg"><p>企業網站實戰</p></li>
??????????????????<li><img?src="http://img1.sycdn.imooc.com//53edad7a0001cde803300130.jpg"><p>javascript基礎</p></li>
??????????</ul>
??????</div>
??????<div?class="content">
??????????<div?class="content_left">
??????????<div?class="boxup">新聞中心</div>
??????????????<div?class="boxdown">
?????????????????
?????????????????<div?class="date">8月23日</div>
?????????????????<div?class="pp">
?????????????????<h3>學習計劃之"Android攻城獅初養成"</h3>
????????????????<p>想成為Android攻城獅?想開發一款專屬App?沒有任何基礎的你?????,應該從何學起?</p>?
????????????????</div><hr>
????????????????
?????????????????<div?class="date">8月23日</div>
?????????????????<div?class="pp">
?????????????????<h3>學習計劃之"Android攻城獅初養成"</h3>
????????????????<p>想成為Android攻城獅?想開發一款專屬App?沒有任何基礎的你?????,應該從何學起?</p>?
?????????????????</div><hr>
???????????????
??????????????
?????????????????<div?class="date">8月23日</div>
?????????????????<div?class="pp">
?????????????????<h3>學習計劃之"Android攻城獅初養成"</h3>
????????????????<p>想成為Android攻城獅?想開發一款專屬App?沒有任何基礎的你?????,應該從何學起?</p>?
?????????????????</div><hr>
???????????
??????????????</div>
??????????????
??????????</div>
??????????<div?class="content_mid">
??????????<div?class="boxup">熱門推薦</div>
??????????<div?class="boxdown">
????????????幕課網2048游戲源碼征集<br>
????????????幕課網2048游戲源碼征集<br>
????????????幕課網2048游戲源碼征集<br>
????????????幕課網2048游戲源碼征集<br>
????????????幕課網2048游戲源碼征集</div>???
??????????</div>??
??????????<div?class="content_right">
??????????????<div?class="boxup">聯系我們</div>
??????????????<div?class="boxdown">
????????????????????聯系我們<br>
????				講師招募：鄒同學<br>
					電話：18888888888<br>
					QQ:4744373X<br>
	???????????????	Email:[email protected]<br>
			????????聯系我們<br?/>
					講師招募：鄒同學<br>
					電話：18888888888<br>
					QQ:4744373X<br>
	???????????????	Email:[email protected]<br>
????????????????</div>
??????????</div>
????????</div>
??????<div?class="bottom">
??????????<p>Copyright???2013?imooc.com?All?Rights?Reserved?京ICP備?13046642號-2</p>
??????</div>
?</div>
??</body>
</html>