<html>
<head>
<title>使用CSS修饰导航栏</title>
<style>
#header ul {
list-style: none;
padding:0;
margin:0;
}
#header li{
display: inline;
border: 1px solid;
border-width: 1px 1px 0 1px;
margin: 0 0.5em 0 0;
}
#header li a {
padding: 0 1em;
}
#content { border: 1px solid;
}
</style>
</head>
<body>
<div id="header">
<h1>导航栏</h1>
<ul>
<li><a href="#">目录1</a></li>
<li><a href="#">目录2</a></li>
<li><a href="#">目录3</a></li>
<li><a href="#">目录4</a></li>
</ul>
</div>
<div id="content">
<p>使用CSS修饰导航栏</p>
</div>
</body>
</html>