CSS模拟制作的techweb网站导航特效代码
用CSS代码，模拟制作techweb网站导航，你需要吗？效果还和真的差不多呢！[code] k4t^W'ra&q<!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>7_$tl*m m i
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">(q!Uc M n)R
<!--
#siteNav {
clear: both;*[Y Hs9xc)hi
float:left;3q7S;]Y(Ir
width:750px;
padding-left: 1px;
background: #fff;
font-size:12px;
font-weight: bold;
line-height:normal;
border-bottom:2px solid #84B0C7;
voice-family: "\"}\"";
voice-family: inherit;
width: 749px;
},L~0XR(O@;s
#siteNav ul {
margin:0;?:v ?Ui'B[
padding:0;
list-style:none; Yy(k+p.D~(~
}
#siteNav li { `%c4`6C,s4?!I]_2l
display:inline;
margin:0; ]O{![G4c S*s ?
padding:0;0Gc CH H:h,X
},kW,l Pcav
#siteNav a {
float:left;8c1amKc&z0i
background:url(http://webclub.net.cn/data/071008/cssbg1.gif) no-repeat left top; l|OyS7A a W4uD4m
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#siteNav a span { Y\"V,X]^Y K.y"K`
float:left;
display:block;
background:url(http://webclub.net.cn/data/071008/cssbg2.gif) no-repeat right top;'u.S Z Q'p e+dU`.i
padding:5px 11px 4px 5px;Jr(I w:Q)[#m
color:#036;[ _7b N#O"ZV
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#siteNav a span {
float:none0A @.Q$MYgW FG\
}]6_)?5nUM J
/* End IE5-Mac hack */C f#N4V3pb.e,E
#siteNav a:hover span {
color:#036;@H+w_ {6^
}
#siteNav a:hover {%v!O|6n.@^N-O @k
background-position:0% -42px;
}
#siteNav a:hover span {r ?U}#R1O,K(h
background-position:100% -42px;
}
#siteNav #sel a {
background-position:0% -42px;5M$d*ZiC&@
}MG Q0O*|
#siteNav #sel a span {+C"W'SfhZk T9`
background-position:100% -42px;)xzr:D| z#R @
}tg @(Lw"Y2o
-->H tQ){ TAb0v JT
</style>
<title>·网络之都·官方论坛‖css预览</title>b1t.ZG ? i!~m
</head>
<body>
<div id="siteNav"> P7jej1vy GB
<ul>
<li id="sel"><a href="#"><span>首页</span></a></li>c4AQytw U
<li><a href="#"><span>资讯</span></a></li>
<li><a href="#"><span>人物</span></a></li>QL G.X k;w`9y F2e
<li><a href="#"><span>管理</span></a></li>
<li><a href="#"><span>经营</span></a></li> [&Bk/?N'S
<li><a href="#"><span>财经</span></a></li>S-IE d6V&n
<li><a href="#"><span>技术</span></a></li>E7m Q\6o,xv
<li><a href="#"><span>产品</span></a></li>^1{^t0t g;g
<li><a href="#"><span>网络</span></a></li>c"WA}%gI.TB9I
<li><a href="#"><span>电信</span></a></li>
<li><a href="#"><span>评论</span></a></li>
<li><a href="#"><span>博客</span></a></li>S {)I~ Ry7b!Q8T7|
<li><a href="#"><span>老友记</span></a></li>!`U g e"x,b#Ib
<li><a href="#"><span>滚动</span></a></li>,s\]t5[:tG
<li><a href="#"><span>搜索</span></a></li>I!k/g'u8a
<li><a href="#"><span>WAP</span></a></li>
</ul>6h m J vDz4F
</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] 网页打不开- -R,n k G)r
看不到效果 还在匈牙利主机上,忘了转过来了$rp'YI`"R/e5K~[E1H(e4^
现在已经好了
页:
[1]