<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>demo</title>
<style type="text/css">
.body{
width: 98%;
height: 200%;
}
.nav{
background: url("global_nav_bg.png") repeat-x scroll 0 0 transparent;
height: 35px;
width: 100%;
z-index: 9998;
position: fixed;
left: 0px;
}
.top{
top: 0px;
}
.bottom{
bottom: 0px;
}
.nav ul{
display: inline;
float: left;
font-size: 14px;
margin: 0 0 0 163px;
}
.nav ul li{
list-style: none outside none;
padding: 0 0 0 2px;
display: inline;
float: left;
position: relative;
z-index: 9998;
color: #FFFFFF;
display: inline-block;
height: 16px;
line-height: 16px;
padding: 9px 10px 8px;
}
ul li a:active, ul li a:link, ul li a:visited{
color: #FFFFFF;
text-decoration: none;
}
ul li a:hover{
color: #FF0000;
text-decoration: underline;
}
</style>
</head>
<body>
<div class="body">
<div class="nav top">
<ul>
<li>
<a href="http://www.baidu.com" target="_blank">百度</a>
</li>
<li>
<a href="http://www.sina.com" target="_blank">新浪</a>
</li>
<li>
<a href="http://cn.yahoo.com" target="_blank">雅虎</a>
</li>
<li>
<a href="http://www.qq.com" target="_blank">騰訊</a>
</li>
<li>
<a href="http://www.renren.com" target="_blank">人人</a>
</li>
</ul>
</div>
<div class="nav bottom">
<ul>
<li>
<a href="http://www.baidu.com" target="_blank">百度</a>
</li>
<li>
<a href="http://www.sina.com" target="_blank">新浪</a>
</li>
<li>
<a href="http://cn.yahoo.com" target="_blank">雅虎</a>
</li>
<li>
<a href="http://www.qq.com" target="_blank">騰訊</a>
</li>
<li>
<a href="http://www.renren.com" target="_blank">人人</a>
</li>
</ul>
</div>
</div>
</body>
</html> 需要用到的圖片global_nav_bg.png