<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>新闻列表</title>
<style>
* { /* 清除内外边距，写样式时常用的*/
margin: 0;
padding: 0;
}
.nav{
width: 380px;
height: 260px;
border: 1px solid #cccccc;
margin-left: 500px;
margin-top: 100px;
padding: 20px 15px 0;
}
.nav h4{
color: #202026;
font-size: 20px;
border-bottom: 1px solid #cccccc;
padding-bottom: 3px;
margin-bottom: 14px;
}
li{
list-style: none; /*取消列表前面的小点 */
}
.nav li{
height: 38px;
line-height: 38px;
border-bottom: 1px dashed #cccccc ; /*下边框虚线*/
text-indent: 2em;/*首行缩进*/
}
.nav a{
text-size: 14px;
color: #333333;
text-decoration: none;
}
.nav a:hover{
/*background-color: darkgrey;*/
text-decoration: underline; /*鼠标触发时添加下划线*/
}
body{
background-color: #eeeeee;
}
</style>
</head>
<body>
<div class="nav">
<h4>最新文章NAv</h4>
<ul>
<li><a href="#">C语言C语言C语言</a></li>
<li><a href="#">JavaJavaJavaJava</a></li>
<li><a href="#">HTMLHTMLHTMLHTML</a></li>
<li><a href="#">csscsscsscss</a></li>
<li><a href="#">JavaScriptJavaScript</a></li>
</ul>
</div>
</body>
</html>
