模板无忧
网页特效
每日更新
|
TOP排行榜
|
Tag标签
|
充值
无忧首页
网页模板
程序模板
建站教程
视频教程
网页特效
图标素材
字体下载
站长工具
站长问答
网页特效
菜单导航
图片特效
文本链接
层和布局
页面背景
表单按钮
日期时间
计算转换
键盘鼠标
浏览器
游戏娱乐
综合其它
常用代码
jQuery特效
Prototype
Ajax/JavaScript
ExtJS
CSS特效
在线编辑器
Mootools
HTML
JS广告代码合集
站长工具
站长常用软件
网站综合查询
Alexa排名查询
Google PR查询
域名Whois查询
网站收录查询
友情链接查询
CSS2中文手册
CSS精简优化工具
网页特效代码
模板无忧
>
网页特效
>
菜单导航特效代码
>
收藏
分享
查看评论
菜单导航
演示
CSS多风格的立体层菜单_菜单导航特效
查看演示效果
特效Tag:
立体菜单
添加
CSS实现的多种风格的立体菜单,有不同的色调供选择,结合了JS技术,可以在多种风格间无刷新切换,挺好玩的。
<HTML> <HEAD> <TITLE>CSS立体层</TITLE> <META http-equiv=Content-Type mrc="text/html; charset=gb2312"> <SCRIPT> function c(css) {up.className=css; alert(css)} </SCRIPT> <STYLE>TABLE,td,div { FONT-SIZE: 9pt; CURSOR: hand; FONT-FAMILY: 宋体 } BODY { FONT-SIZE: 9pt; FONT-FAMILY: Tahoma; BACKGROUND-COLOR: #637994 } .yellow { BORDER-RIGHT: #8a6100 2px solid; BORDER-TOP: #ffe3a4 2px solid; BORDER-LEFT: #ffe3a4 2px solid; COLOR: #ffff00; BORDER-BOTTOM: #8a6100 2px solid; BACKGROUND-COLOR: #e19d00 } .blue { BORDER-RIGHT: #002200 2px solid; BORDER-TOP: #a6c1df 2px solid; BORDER-LEFT: #a6c1df 2px solid; COLOR: #ffffff; BORDER-BOTTOM: #002200 2px solid; BACKGROUND-COLOR: #3a6ea5 } .green { BORDER-RIGHT: #002200 2px solid; BORDER-TOP: #b9ffb9 2px solid; BORDER-LEFT: #b9ffb9 2px solid; COLOR: #ffff00; BORDER-BOTTOM: #002200 2px solid; BACKGROUND-COLOR: #008000 } .menu { BORDER-RIGHT: #FFFFFF 2px solid; BORDER-TOP: #000000 2px solid; BORDER-LEFT: #000000 2px solid; COLOR: #000080; BORDER-BOTTOM: #FFFFFF 2px solid; BACKGROUND-COLOR: #d8d8d0 } .menu1 { BORDER-RIGHT: #000000 2px solid; BORDER-TOP: #adbac9 2px solid; BORDER-LEFT: #adbac9 2px solid; COLOR: #ffffff; BORDER-BOTTOM: #000000 2px solid; BACKGROUND-COLOR: #637994 } .blue1 { BORDER-RIGHT: #000000 2px solid; BORDER-TOP: #d0ecff 2px solid; BORDER-LEFT: #d0ecff 2px solid; COLOR: #ffff00; BORDER-BOTTOM: #000000 2px solid; BACKGROUND-COLOR: #0099ff } .black { BORDER-RIGHT: #000000 2px solid; BORDER-TOP: #d0d0d0 2px solid; BORDER-LEFT: #d0d0d0 2px solid; COLOR: #ffffff; BORDER-BOTTOM: #000000 2px solid; BACKGROUND-COLOR: #000000 } </STYLE> <META mrc="Microsoft FrontPage 4.0" name=GENERATOR></HEAD> <BODY bgColor=#adbac9> <DIV class=yellow id=up style="left: 294; width: 196; position: absolute; top: 79; height: 72"> <P align=center><br> <br>立体效果的层</P></DIV> <DIV align=center> <CENTER> <TABLE cellSpacing=0 cellPadding=0 width=400 border=0> <TBODY> <TR> <TD class=menu onclick='c("menu")' align=middle width=50>灰</TD> <TD class=green onclick='c("green")' align=middle width=50>绿</TD> <TD class=blue onclick='c("blue")' align=middle width=50>蓝</TD> <TD class=yellow onclick='c("yellow")' align=middle width=50>黄</TD> <TD class=menu1 onclick='c("menu1")' align=middle width=50>灰1</TD> <TD class=blue1 onclick='c("blue1")' align=middle width=50>浅蓝</TD> <TD class=black onclick='c("black")' align=middle width=50>黑</TD> <TD align=middle width=50></TD></TR></TBODY></TABLE></CENTER></DIV> </BODY> </HTML>
所属频道:
菜单导航特效
/
更新时间:2010-05-22
[收藏]
[报错]
[返回列表]
相关
菜单导航特效
:
CSS+div+js组合强大实现超酷菜单
超酷仿GOOGLE首页导航菜单效果
仿网易的滑动门技术DIV+CSS实现
仿蓝色理想网站的导航菜单
鼠标触及带边框菜单
用JS实现的类似框架的链接导航模式
CSS立体层
右键弹出菜单
纯css的导航下拉菜单
隐藏菜单效果
css模拟title和alt的提示效果
下拉菜单链接页面打开方式选择
菜单导航特效Rss订阅
特效代码搜索
菜单导航特效推荐
仿雅虎另类CSS滑动门切换
选项卡式的菜单
下拉菜单的新型选择方式
仿网易的滑动门技术DIV+CSS实现
CSS+js实现的后台管理菜单
Windows 风格选项卡标签
仿淘宝网的网页选项卡(超级漂亮)
JS模拟的QQ面板上的多级可展开的菜单
凭空取菜单
Mootools做的有意思菜单
猜你也喜欢看这些
XML动画
点击图片某一区域放大图片,新型图片放大特效
在网页随意可拖动图片移动位置
JavaScript图片特效
精美图片滚动
图片控制内容框的文字上下翻滚
规定区域的JS拖动展示效果
齿轮--效果非常棒
让背景图片也具有链接热点的功能
JavaScript图片放大技术代码示例及注释
相关链接:
复制本页链接
|
搜索CSS多风格的立体层菜单
特效说明:
菜单导航模板
-
CSS多风格的立体层菜单
。