不知哪里设错,新闻中心 line height 不生效还有这个 more<< 无法居中
代码如下 主要在是news这个div的上中部分出问题,求大神帮忙看下
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<link href="css/stylesheet.css"type="text/css"rel="stylesheet" />
<script src="js/setHomeSetFav.js" type="text/javascript"></script>
<script src="js/myfocus-2.0.1.min.js" type="text/javascript"></script>
<script src="js/mf-pattern/mF_fancy.js" type="text/javascript"></script>
<link href="js/mf-pattern/mF_fancy.css" type="text/css" rel="stylesheet" />
<script type="text/javascript">
myFocus.set({id:"picBox", time:1.5 ,})
</script>
</head>
<body>
<div class="header">
<div class="top_nav">
<ul>
<li><a href="#">联系我们</a></li>
<li><a href="#">加入收藏</a></li>
<li><a href="#">设为首页</a></li>
</ul>
</div>
</div>
<!--页面顶端header结束-->
<div class="wrap">
<div class="logo">
<div class="logo_left"><img src="images/logo.jpg" alt="慕课网"/></div>
<div class="logo_right"><img src="images/tel.jpg" alt="服务热线"/>24小时服务热线:<span>123-456-7890</span></div>
</div><!--页面logo结束-->
<div class="nav">
<div class="left_nav"></div>
<div class="main_nav">
<div class="main_nav_left">
<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 class="main_nav_right">
<form action="" method="post">
<input type="text" class="search"/>
</form>
</div>
</div>
<div class="right_nav"></div>
</div><!--nav导航结束-->
<div class="ab" id="picBox">
<div class="loading"><img src="images/loading.gif" alt="图片加载中" /></div>
<div class="pic">
<ul>
<li><img src="images/ad2.jpg" /></li>
<li><img src="images/ad3.jpg" /></li>
<li><img src="images/ad4.jpg" /></li>
</ul>
</div>
</div>
</div><!--页面wrap结束-->
<div class="main">
<div class="news">
<div class="title">
<h3 class="title_left">新闻列表</h3>
<span class="title_right"><a href="#" >More>></a></span>
</div>
<div class="pic_news">
<div class="pic_news_left">
<img src="images/news.jpg" width="113" height="80" />
</div>
<div class="pic_news_right">
<h2 ><a href="#">520 慕女神喊你来表白!</a></h2><p>活动时间:5月20日—5月25日<br />获奖公布时间:5月26日<br /><a href="#">Learn More>></a></p>
</div>
</div>
<div class="news_list">
<ul>
<li><span>2014-06-01</span> <a href="news.html">【慕客访谈 用户篇】“有为屌丝”在路上</a></li>
<li><span>2014-06-01</span><a href="news.html">【有奖活动】给父亲的三行书信</a></li>
<li><span>2014-05-30</span><a href="news.html">《程序猿,请晒出你的童年》活动获奖公告</a></li>
<li><span>2014-05-28</span><a href="news.html" title="aa">【慕课访谈】破茧成蝶——美女程序员的蜕变史</a></li>
</ul>
</div>
</div>
</div><!--news 结束-->
<div class="course"></div>
<div class="sidebar"></div>
</div>
</body>
</html>
样式表:
*{
margin:0;
padding:0;
font:12px 微软雅黑;
}
body{
background-color: #F5F5F5;
}
ul{
list-style-type:none;
}
.wrap{
width:1000px;
margin:0 auto;
}
.header{
width:100%;
background:url(images/top_bg.jpg) repeat-x;
}
.top_nav{
width:1000px;
margin:0 auto;
height:30px;
}
.top_nav li{
float:right;
width:70px;
line-height:30px;
list-style-image:url(../images/arrow.jpg);
}
.top_nav a:link, .top_nav a:visited{
color:#8E8E8E;
text-decoration:none;
}
.top_nav a:hover, .top_nav a:active{
color:#C00;
text-decoration:none;
}
.wrap{
width:1000px;
margin:0 auto;
}
.logo{
height:80px;
background:#fff;
}
.logo_left{
float:left;
width:300px;
}
.logo_right{
float:right;
width:300px;
height:28px;
margin-top:30px;
color:#8E8E8E;
}
.logo_right img{
vertical-align:middle;
margin-right:10px;
}
.logo_right span{
color:#C00;
font-size:16px;
font-family:"微软雅黑";
}
.nav{
height:40px;
width:1000px;
margin:0 auto;
}
.left_nav{
width:10px;
background:url(../images/nav_left.jpg) no-repeat;
}
.main_nav{
width:980px;
background:url(../images/nav_bg.jpg) repeat-x;}
.right_nav{
width:10px;
background:url(../images/nav_right.jpg) no-repeat;
}
.left_nav, .main_nav, .right_nav{
height:40px;
float:left;
display:inline;
}
.main_nav_left, .main_nav_right{
float:left;
}
.main_nav_left{
width:680px;
}
.main_nav_right{
width:300px;
}
.main_nav_left li{
float:left;
width:100px;
text-align:center;
line-height:40px;
}
.main_nav_left a:link, main_nav_right a:visited{
text-decoration:none;
color:#fff;
font-size:15px;
font-family:"微软雅黑"
}
.main_nav_left a:hover, main_nav_right a:active{
text-decoration:none;
color:#CF0;
font-size:15px;
font-family:"微软雅黑"
}
.main_nav_right .search{
width:200px;
height:25px;
margin-top:5px;
border:#999 1px solid;
background:url(../images/search.jpg) no-repeat right center;
background-color:#fff;
padding-right:25px;
}
.ab{
height:310px;
overflow:hidden;
}
.main{
width:1000px;
margin:5px auto;
background: #FFF;
}
.news{
width:340px;
background:#fff;
}
.course{
width:410px;
margin:0 7px;
}
.sidebar{
width:230px;
background:red;
}
.news, .course, .sidebar{
height:250px;
float:left;
border:#E8E8E8 1px solid;
}
.title {
height:35px;
border-bottom: 2px solid #E8E8E8;
}
.title_left{
width:70%;
font-size:15px;
font-family:"微软雅黑";
font-weight:bold;
color:#786F66;
float:left;
line-height:35px;
padding-left:20px;
}
.title_right {
width: 20%;
height:35px;
text-align:center;
line-height:35px;
}
.title_right a{
text-decoration:none;
color:#999;
font-size:10px;
font-family:"微软雅黑"
}
.pic_news {
height:80px;
margin-top:10px;
line-height:20px;
}
.pic_news_left {
float:left;
height:85px;
margin:0 5px;
}
.pic_news_right{
float:left;
font:14px 宋体;
}
.pic_news a{
color:#c00;
text-decoration:none;
}