<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>www.flyso.cn--CSS布局中当前页面的做法</title>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-152060-1";
urchinTracker();
</script>
<style type="text/css">
body{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
*{
margin: 0;
padding: 0;
list-style: none;
}
#nav{
padding: 10px 10px 0;
font-size: 11px;
font-weight: bold;
}
#nav li{
float: left;
margin-right: 1px;
}
#nav li a{
padding: 4px 10px 2px 14px;
text-decoration: none;
background: #DDD url(navbg.gif) no-repeat;
color: #666;
display: block;
float: left;
}
#nav li a:hover{
color: #CCC;
background-color: #FFDEAD;
}
#navbar{
background:#DC4E1B;
height: 8px;
overflow: hidden;
clear: both;
}
#home #nav li#m1 a,
#about #nav li#m2 a,
#products #nav li#m3 a,
#services #nav li#m4 a,
#contact #nav li#m5 a{
color: #FFF;
background: #DC4E1B url(navbg.gif) no-repeat;
}
p{
margin: 10px;
}
</style>
</head>
<body id="home">
<ul id="nav">
<li id="m1"><a href="http://www.forest53.com/tutorials/menu/index.html">Home</a></li>
<li id="m2"><a href="http://www.forest53.com/tutorials/menu/about.html">About</a></li>
<li id="m3"><a href="http://www.forest53.com/tutorials/menu/products.html">Products</a></li>
<li id="m4"><a href="http://www.forest53.com/tutorials/menu/services.html">Services</a></li>
<li id="m5"><a href="http://www.forest53.com/tutorials/menu/contact.html">Contact</a></li>
</ul>
<div id="navbar"></div>
<p>当前位置：Home</p>
<p><a href="javascript:history.back()">Back</a></p>
<script src="/js/copyrightdemo.js" type="text/javascript"></script>
</body>
</html>