CSS模拟制作的techweb网站导航特效代码
用CSS代码，模拟制作techweb网站导航，你需要吗？效果还和真的差不多呢！[code]<!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> ]9QV f{3w g+b
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />rR D/B }
<style type="text/css">
<!--
#siteNav {
clear: both; C#L i ? q x BK
float:left;
width:750px;/| k&[ G*W4H&a(cO
padding-left: 1px;
background: #fff;1wS Erg#d&Ij!t
font-size:12px;cwU)N"^/a
font-weight: bold;P"y#}Ukr vR
line-height:normal;~!DF SJF&T
border-bottom:2px solid #84B0C7;
voice-family: "\"}\"";
voice-family: inherit;
width: 749px;.P D+D$X:N4w
}
#siteNav ul {tW%u%af J2{8s9@
margin:0;
padding:0;
list-style:none; |:Z|)x)N1}&F:S P\9P'd
}9?!s8m ~#Q `L
#siteNav li { WA yq#m6@/?
display:inline;3IE:hv:U6P S N'f d
margin:0;r*p9i#zaOl!^c
padding:0;'s:q Z:x&@'|s
}
#siteNav a {yQmo&Fk:z+O
float:left;)z{)e(M5aH3ZG
background:url(http://webclub.net.cn/data/071008/cssbg1.gif) no-repeat left top;
margin:0;
padding:0 0 0 4px;3wb hk,bM$u p
text-decoration:none;
}2q%h*hTO;a
#siteNav a span {
float:left;
display:block;w x(@e:L j-g
background:url(http://webclub.net.cn/data/071008/cssbg2.gif) no-repeat right top;v ]5^ `v2];gu5h ?fj
padding:5px 11px 4px 5px;0J+?!Zn PYv.L2rEV
color:#036;
})R0j,M'YCcHVk
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#siteNav a span {
float:none
}(a g!d2F@
/* End IE5-Mac hack */
#siteNav a:hover span {
color:#036;
}
#siteNav a:hover {
background-position:0% -42px;
} _\:L;Pl+@5G0u$G
#siteNav a:hover span {
background-position:100% -42px;8u1m,q T'Y'?
}9pZ*F+\w)`v!W
#siteNav #sel a {Tn5y,j0\(X
background-position:0% -42px; c;R-NiB3M!X G
}$v m`?Vh!N!b5N
#siteNav #sel a span {.v-YJ%`2qM a7P.S
background-position:100% -42px;
} @ jf+`l
-->0UWrm!bs+koN
</style>'C_;L s D
<title>·网络之都·官方论坛‖css预览</title>
</head> W W5X4W.T-uA
<body>C0i E K R0?
<div id="siteNav">
<ul>
<li id="sel"><a href="#"><span>首页</span></a></li>
<li><a href="#"><span>资讯</span></a></li>X/d ^RQ \
<li><a href="#"><span>人物</span></a></li>
<li><a href="#"><span>管理</span></a></li>
<li><a href="#"><span>经营</span></a></li>
<li><a href="#"><span>财经</span></a></li>d\BZBw~4W
<li><a href="#"><span>技术</span></a></li>3Yl8PH9r7d&Ng pO
<li><a href="#"><span>产品</span></a></li>
<li><a href="#"><span>网络</span></a></li>
<li><a href="#"><span>电信</span></a></li>
<li><a href="#"><span>评论</span></a></li>
<li><a href="#"><span>博客</span></a></li> S}&WQr6W
<li><a href="#"><span>老友记</span></a></li>U,w$j'|GZ
<li><a href="#"><span>滚动</span></a></li>
<li><a href="#"><span>搜索</span></a></li> [2Cwn X x b8J
<li><a href="#"><span>WAP</span></a></li>i5C1Cl$|
</ul>
</div>
</body>
</html>[/code]效果预览：[color=#0000ff][url=http://webclub.net.cn/data/071008/css.htm]http://webclub.net.cn/data/071008/css.htm[/url][/color] 网页打不开- -K5Ef?"d m$o!Y r
看不到效果 还在匈牙利主机上,忘了转过来了
现在已经好了
页:
[1]