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>(WKmL x4B
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
<!--
#siteNav {rS"X$z$T&c
clear: both;rO?5L/|
float:left;/o.Z J&m6w Fl
width:750px;
padding-left: 1px;;B(` cK J i
background: #fff;&PTK8[Y T+c [
font-size:12px;
font-weight: bold;;Jp K;z[8L
line-height:normal;"~@T,g {
border-bottom:2px solid #84B0C7;VbBu6f8zb
voice-family: "\"}\"";
voice-family: inherit;"] n I*jcX y3O A
width: 749px;
}
#siteNav ul {J g*irt2M)`
margin:0;F"w4P f,v+H3j
padding:0;#r.P!YF&A-\1jU
list-style:none;
}r_|7`i|o(y#N
#siteNav li {
display:inline;
margin:0; D[%V of] hOv
padding:0;
}d\stp-k!yI
#siteNav a {'N+q \x9}
float:left;
background:url(http://webclub.net.cn/data/071008/cssbg1.gif) no-repeat left top;
margin:0;
padding:0 0 0 4px;+`S9RJy_~(ytD
text-decoration:none;t H H:y+N%TpW
};{4tO+r z Y;C"d+B9J:c `#Xc
#siteNav a span {v?wXe5U
float:left;.NaL @+@5zu$qb$N
display:block; LT:V3s s Z ULc(L U e,d
background:url(http://webclub.net.cn/data/071008/cssbg2.gif) no-repeat right top;P5O$R,M8X%y e1x:t
padding:5px 11px 4px 5px;b@#O:_ }s{#W)J
color:#036; g5~KOT*\,hv%M
}hhU b!N Cj'ek
/* Commented Backslash Hack hides rule from IE5-Mac \*/{i5svr p4_ lh5B
#siteNav a span {u gC l Igv8P
float:none-nWlvR A
}2or5VAd LU
/* End IE5-Mac hack */q c#B4N8Kh
#siteNav a:hover span { T+o$u Uj A(Vl y
color:#036;#evU$o1fw6D i
} B V+a x*rO
#siteNav a:hover { F7}'X#L U
background-position:0% -42px;
} I*^4I$pI^
#siteNav a:hover span {Cb [iW D
background-position:100% -42px;}0zx8BG,z#[
}
#siteNav #sel a {.|9mD%n!O~7u C
background-position:0% -42px;6DVD#R Ef&c
}7k5Ws$N I!jE
#siteNav #sel a span {
background-position:100% -42px;
}&HP;U d` bn&t"mY C
-->VEB4F\W @ [ Z
</style>
<title>·网络之都·官方论坛‖css预览</title>
</head>5[l{:z"VA q+v Aw
<body> G!wZ/ME5Ph.N2d|
<div id="siteNav">
<ul>8O'`$R/b/d3| O ]r+c-j.y
<li id="sel"><a href="#"><span>首页</span></a></li>"}6j Szp V
<li><a href="#"><span>资讯</span></a></li>
<li><a href="#"><span>人物</span></a></li>/v Fb B Vq Z9O4S8Tk
<li><a href="#"><span>管理</span></a></li>N3YJ C+|c4o
<li><a href="#"><span>经营</span></a></li>
<li><a href="#"><span>财经</span></a></li>+Xv2}d3K \1Rg
<li><a href="#"><span>技术</span></a></li>
<li><a href="#"><span>产品</span></a></li>
<li><a href="#"><span>网络</span></a></li>npb$fVo X_
<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>z8z0FUU,@
<li><a href="#"><span>搜索</span></a></li>%jb9u4U Ij0w ~
<li><a href="#"><span>WAP</span></a></li>5T&O/AtAF3}_j
</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] 网页打不开- -
看不到效果 还在匈牙利主机上,忘了转过来了
现在已经好了
页:
[1]