设置margin不起作用,无法将代码中的lb块和news块隔开
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>企业网站</title>
<link href="main.css" rel="stylesheet" type="text/css">
<script src="http://demo.jb51.net/js/myfocus/content/templates/myfocus/js/myfocus-2.0.1.min.js"></script>
<script type="text/javascript">
myFocus.set({
id:'idbox'
});
</script>
</head>
<body>
<div class="header">
<div class="logo"><img src="http://img1.sycdn.imooc.com//53edadad0001efe202000070.jpg"></div>
<div class="nav">
<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 class="wrap">
<div class="center">
<div class="lbt" id="idbox">
<div class="loading"><img src="http://img1.sycdn.imooc.com//53edad8c000175cb00300029.jpg"></div>
<div class="pic">
<ul>
<li><img src="http://img1.sycdn.imooc.com//53edad3e0001afad10000318.jpg">
</li>
<li><img src="http://img1.sycdn.imooc.com//53edad2c0001b61310000314.jpg">
</li>
<li><img src="http://img1.sycdn.imooc.com//53edad1600019ae910000310.jpg">
</li>
</ul>
</div>
</div>
<div class="news">
<div class="news_top">
<ul>
<li><a href="#">滚动新闻</a></li>
<li><a href="#">这是滚动新闻</a></li>
</ul>
</div>
<div class="news_bottom">
<ul>
<li><img src="http://img1.sycdn.imooc.com//53edad54000119fb03300130.jpg"><span>玩转bootstrap</span></li>
<li class="mr_3"><img src="http://img1.sycdn.imooc.com//53edad690001260a03300130.jpg"><span>企业网站实战</span></li>
<li><img src="http://img1.sycdn.imooc.com//53edad7a0001cde803300130.jpg"><span>javascript基础</span></li>
</ul>
</div>
</div>
<div class="lb">
<div class="xw">
<div class="xw_top">新闻中心</div>
<div class="xw_bottom">
<ul>
<li><span>8月23日</span><h2>培训计划“安卓工程师养成”</h2><p>想成为安卓工程师?没有任何基础,不知道从何学起?想开发一款属于自己的APP?</p></li>
<li><span>8月23日</span><h2></h2><p></p></li>
<li><span>8月23日</span><h2></h2><p></p></li>
</ul>
</div>
</div>
<div class="hd"></div>
<div class="lx"></div>
</div>
</div>
<div class="footer"></div>
</div>
</body>
</html>
*{
margin:0;
padding:0;
font-family:"微软雅黑";}
.header{
width:100%;
height:80px;
}
.logo{
float:left;
margin-right:10px;}
.nav li{
float:left;
list-style:none;
text-align:center;
}
.nav a:link,.nav a:visited{
text-decoration:none;
display:block;
width:110px;
height:65px;
line-height:65px;
color:black;
font-family:"微软雅黑";
}
.nav a:hover{
background-color:red;
}
.wrap{
width:1000px;
margin:0 auto;
}
.lbt{
height:310px;
width:1000px;
overflow:hidden;
}
.news_top{
height:40px;
background-color:gray;
margin-top:10px;
}
.news_top li{
list-style:none;
float:left;
text-align:center;
}
.news_top a:link,.news_top a:visited{
display:block;
height:40px;
width:100px;
text-decoration:none;
color:white;
font-family:"微软雅黑";
line-height:40px;
}
.news_top a:hover{
background-color:red;
}
.news_bottom{
margin-top:10px;
margin-bottom:20px;
}
.news_bottom li{
list-style:none;
float:left;
width:330px;
text-align:center;
}
.mr_3{
margin:0 3px;
}
.lb{
clear:both;
height:350px;
}
.xw,.hd,.lx{
width:330px;
}
.xw_top,.hd_top,.lx_top{
height:30px;
background-color:red;
color:white;
padding-left:20px;
line-height:30px;
}