-
很酷的css菜单
<html>
<head>
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
<STYLE type=text/css>![](https://www.cnblogs.com/Images/dot.gif)
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation {
}{
background:#99CCFF;
width:715px;
margin:0 auto;
height:38px;
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
/**//* hide overflow:hidden from IE5/Mac */
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
/**//* \*/
overflow: hidden;
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
/**//* */
}
![](/Images/OutliningIndicators/InBlock.gif)
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation ul {
}{
margin:0;
padding:0;
list-style-type:none;
background:transparent;
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation li {
}{
display:block;
float:left;
margin:0 1px;
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .snazzy {
}{
background:transparent;
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .snazzy span {
}{
text-align:center;
color:#fff;
margin:0;
font-weight: normal;
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .b1, #navigation .b2, #navigation .b3, #navigation .b4 {
}{
display:block;
font-size:1px;
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
/**//* hide overflow:hidden from IE5/Mac */
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
/**//* \*/
overflow: hidden;
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
/**//* */
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .b1, #navigation .b2, #navigation .b3 {
}{
height:1px;
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .b2, #navigation .b3, #navigation .b4 {
}{
border-left:1px solid #fff;
border-right:1px solid #fff;
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .b1 {
}{
margin:0 5px;
background:#fff;
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .b2 {
}{
margin:0 3px;
border-width:0 2px;
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .b3 {
}{
margin:0 2px;
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .b4 {
}{
height:2px;
margin:0 1px;
}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .boxcontent {
}{
display:block;
border-left:1px solid #fff;
border-right:1px solid #fff;
}
![](/Images/OutliningIndicators/InBlock.gif)
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation a.menu, #navigation a.menu:visited {
}{
display:block;
text-decoration:none;
width:100px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
![](/Images/OutliningIndicators/InBlock.gif)
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation a.current span, #navigation a.current:visited span {
}{
padding-top:10px;
}
![](/Images/OutliningIndicators/InBlock.gif)
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation a.menu:hover {
}{
background:transparent;
cursor:pointer;
}
![](/Images/OutliningIndicators/InBlock.gif)
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation a.current:hover {
}{
cursor:default;
}
![](/Images/OutliningIndicators/InBlock.gif)
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation a.menu:hover span {
}{
padding-top:10px;
}
![](/Images/OutliningIndicators/InBlock.gif)
![](/Images/OutliningIndicators/InBlock.gif)
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .red {
}{background:#c00;}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .orange {
}{background:#f90;}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .yellow {
}{background:#b8b800;}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .green {
}{background:#090;}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .blue {
}{background:#00c;}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .indigo {
}{background:#309;}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .violet {
}{background:#c6c;}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .lace {
}{background:#e0e0d5;}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .slate {
}{background:#bcdae9;}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .salmon {
}{background:#ffa07a;}
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
#navigation .mint {
}{background:#f5fffa;}
![](/Images/OutliningIndicators/InBlock.gif)
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
span {
}{background:#000}
</STYLE>
</head>
![](/Images/OutliningIndicators/None.gif)
<body>
<center>
<DIV id=navigation>
<UL>
<LI><A class=menu title="AccessKey: a" accessKey=a href="../menu/index.html"><B class=snazzy><SPAN class="boxcontent red">Demos</SPAN> <B class="b4 red"></B><B class="b3 red"></B><B class="b2 red"></B><B class=b1></B></B></A></LI>
<LI><A class=menu title="AccessKey: b" accessKey=b href="../menus/index.html"><B class=snazzy><SPAN class="boxcontent orange">Menus</SPAN> <B class="b4 orange"></B><B class="b3 orange"></B><B class="b2 orange"></B><B class=b1></B></B></A></LI>
<LI><A class="menu current" title="AccessKey: c" accessKey=c href="#nogo"><B class=snazzy><SPAN class="boxcontent yellow">Layouts</SPAN> <B class="b4 yellow"></B><B class="b3 yellow"></B><B class="b2 yellow"></B><B class=b1></B></B></A></LI>
<LI><A class=menu title="AccessKey: d" accessKey=d href="../boxes/index.html"><B class=snazzy><SPAN class="boxcontent green">Boxes</SPAN> <B class="b4 green"></B><B class="b3 green"></B><B class="b2 green"></B><B class=b1></B></B></A></LI>
<LI><A class=menu title="AccessKey: e" accessKey=e href="../mozilla/index.html"><B class=snazzy><SPAN class="boxcontent blue">Mozilla</SPAN> <B class="b4 blue"></B><B class="b3 blue"></B><B class="b2 blue"></B><B class=b1></B></B></A></LI>
<LI><A class=menu title="AccessKey: f" accessKey=f href="../ie/index.html"><B class=snazzy><SPAN class="boxcontent indigo">Explorer</SPAN> <B class="b4 indigo"></B><B class="b3 indigo"></B><B class="b2 indigo"></B><B class=b1></B></B></A></LI>
<LI><A class=menu title="AccessKey: g" accessKey=g href="../opacity/index.html"><B class=snazzy><SPAN class="boxcontent violet">Opacity</SPAN> <B class="b4 violet"></B><B class="b3 violet"></B><B class="b2 violet"></B><B class=b1></B></B></A></LI></UL>
</DIV><!-- end of navigation -->
</center>
</body>
</html>
-
相关阅读:
Unity 坐标系及相互转化
Unity 接口&接口类
Unity 场景管理/切换
Unity 光照系统中的阴影
《算法竞赛进阶指南》0x41并查集 银河英雄传说(边带权并查集)
《算法竞赛进阶指南》0x41并查集 NOI2015程序自动分析
《算法竞赛进阶指南》0x38概率与期望 扑克牌
《算法竞赛进阶指南》0x38概率与数学期望 绿豆蛙的归宿
《算法竞赛进阶指南》0x38概率与数学期望 Rainbow
基于Python的模拟退火算法SA 以函数极值+TSP问题为例(gif动态展示)
-
原文地址:https://www.cnblogs.com/chengulv/p/298541.html
Copyright © 2020-2023
润新知