菜单导航集合
突起的导航栏效果[经典]
突起的导航栏效果[经典]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">powered by 25175.net
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>border-style的outset属性</title>
<style type="text/css">
.bevelmenu{ font: bold 13px arial; padding: 6px 0; margin: 0; width: 100%; background-color: #FFF2BF; text-align: left; /*将值设置为"right"菜单会向右靠拢*/ }
.bevelmenu li{ list-style: none; display: inline; }
.bevelmenu li a{ padding: 3px 0.5em; text-decoration: none; color: black; background-color: #FFF2BF; border: 2px solid #FFF2BF; }
.bevelmenu li a:hover{ color: black; background-color: #FFE271; border-style: outset; }
html>body .bevelmenu li a:active{ /* 鼠标按下的效果只有非IE浏览器才支持 */ border-style: inset; } </style>
</head>
<BODY>
<ul class="bevelmenu"><li><a href="http://www.sina.com">新浪</a> </li><li><a href="http://www.163.com">网易</a> </li><li><a href="http://www.baidu.com">Baidu</a> </li><li><a href="http://www.yahoo.com">yahoo</a> </li><li><a href="http://www.google.com">Google</a> </li><li><a href="http://www.25175.com">25175</a> </li> </ul>
</BODY>
</html>
| 【内容导航】 | |
| 第1页:完全用CSS实现的中英文双语导航菜单(经典) | 第2页:商业风格的CSS垂直菜单 |
| 第3页:突起的导航栏效果[经典] | 第4页:点击显示的FAQ菜单效果[经典] |
| 第5页:一款DIV+CSS闪动导航条效果(经典) | 第6页:非常酷的CSS菜单效果B(经典) |
| 第7页:非常酷的CSS菜单效果A(经典) | 第8页:会旋转的菜单导航(经典) |
| 第9页:带项目描述的导航菜单(经典) | 第10页:聚合的导航菜单效果(经典) |
| 第11页:整合在IE中的导航条(经典) | 第12页:含下拉菜单的绿色导航条 |
| 第13页:关联菜单(连动菜单) | 第14页:可拖动的导航菜单 |
| 第15页:多级滚动菜单 | 第16页:微软导航菜单 |
| 第17页:鼠标移到文字上自动展开 | 第18页:点击渐显的导航菜单 |
| 第19页:随机网站推荐脚本 | 第20页:网站内快捷键导航 |
| 第21页:左侧导航菜单类似按钮 | 第22页:可移动的导航栏 |
| 第23页:页面顶部多级导航栏 | 第24页:浮动、隐藏的导航菜单 |
| 第25页:上下弹动的导航条 | 第26页:鼠标指向显示次级菜单 |
| 第27页:漂亮的仿flash菜单 | 第28页:滑动的层作菜单导航 |
| 第29页:精彩的跳动菜单效果 | 第30页:类似与QQ的好友/黑名单之类的树型菜单 |
| 第31页:定时改变标题栏的内容 | |
上一篇:状态栏特效集合
下一篇:弹出浏览器的版本信息
|
|
这个浮动导航栏效果如何? www.bj-pingan.cn
(YOYO
,10月23日 15:12
)
很好...
(as
,10月07日
)
晕
(ju
,08月05日
)
1212
(445465
,05月30日
)
