<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>新闻列表案例</title>
<style>
*{
margin: 0;
padding: 0;
}
li{
list-style: none;
}
.nav{
width: 270px;
height: 190px;
margin: 100px auto;
border: 1px solid
padding: 15px;
background: url(line.jpg);
}
.nav h2{
font-size: 18px;
padding: 5px 0;
border-bottom: 1px solid
margin-bottom: 10px;
}
.nav ul li{
height: 30px;
line-height: 30px;
border-bottom: 1px dashed
background: url(arr.jpg) no-repeat 5px center;
padding-left: 20px;
}
.nav ul li a{
color:
text-decoration: none;
font-size: 12px;
}
.nav ul li a:hover{
text-decoration: underline;
}
</style>
</head>
<body>
<div class="nav">
<h2>最新文章/New Articles</h2>
<ul>
<li><a href="">北京招聘网页设计,平面设计,php</a></li>
<li><a href="">体验javascript的魅力</a></li>
<li><a href="">jquery世界来临</a></li>
<li><a href="">网页设计师的梦想</a></li>
<li><a href="">jquery中的链式编程是什么</a></li>
</ul>
</div>
</body>
</html>