Dreamweaver中实现双背景图片导航菜单的代码

时间：2021-05-08


复制代码代码如下:<!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=gb2312" />
　　<title>www.jb51.net</title>
　　</head>
　　<style type=text/css>
　　#nav ul {
　　font-size: 11px;
　　margin: 0px auto 100px;
　　padding:0;
　　font-family: arial, verdana, sans-serif;
　　white-space: nowrap;
　　list-style-type: none
　　}
　　#nav li {
　　float: left;
　　margin:0;
　　padding:0;
　　}
　　#nav a {
　　float: left;
　　margin: 0px 2px 0px 0px;
　　padding:0 0 0 2px;
　　color: #fff;
　　background: url(../js/jsneedpic/i200741210911.gif) #040 no-repeat left bottom;
　　letter-spacing: 1px;
　　text-decoration: none
　　}
　　#nav a strong {
　　display: block;
　　background: url(../js/jsneedpic/j200741210920.gif) no-repeat right bottom;
　　float: left;
　　padding:5px 16px 5px 12px;
　　}
　　#nav a:hover {
　　cursor: pointer;
　　background-color: #080
　　}
　　#nav #current a {
　　background-color: #080
　　}
　　#nav {
　　border-top: #040 8px solid;
　　background: #fff;
　　padding:1px 0 0 0;
　　}
　　</style>
　　<body>
　　<div id="nav">
　　<ul>
　　<li><a href="#"><strong>home</strong></a> _fcksavedurl=""#"><strong>home</strong></a>" </li>
　　<li><a href="#"><strong>privacypolicy</strong></a> </li>
　　<li id="current"><a href="#"><strong>contact us</strong></a> </li>
　　<li><a href="#"><strong>products</strong></a> </li>
　　<li><a href="#"><strong>site map</strong></a> </li>
　　</ul>
　　</div>
　　</body>
　　</html>

声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

相关文章