<!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=utf-8" />
<title>无标题文档</title>
</head>
<style>
#left{
float:left;
background-image:url(../images/menu.jpg);
width:290px;
height:550px;
padding-top:350px;
/*#first*中height值等于#left中height值和padding-top值的和*/
}
/*左侧导航部分*/
#nav{
width:220px;
margin-left:70px;
text-align:right;
}
#nav a {
color:#000;
height:24px;
display:block;
text-decoration:none;
}
#nav a:hover{
width:220px;
background:url(../images/left_background_1.gif);
list-style:none;
color:#f1dcb1;
}
#nav li {
width:170px;
padding-right:50px;/*li的width值与padding-right值和不能超过nav的width值*/
line-height:25px;
list-style:none;
background:url(../images/left_background_2.gif);
font:Verdana, Geneva, sans-serif;
float:left;
}
</style>
<body>
<!--左边的层-->
<div id="left">
<div id="nav">
<ul>
<li><a href="index.html">HOME 网站首页</a></li>
<li><a href="dywh.html">CULTURE 公司简介</a></li>
<li><a href="service.html">SERVICE 解决方案</a></li>
<li><a href="design.html">DESIGN 设计展示</a></li>
<li><a href="plans.html">PLANS 策划案例</a></li>
<li><a href="about.html">ABOUT 关于我们</a></li>
<li><a href="link.html">CONTACT 联系我们</a></li>
</ul>
</div>
</div>
</body>
</html>
代码
