zoukankan
html css js c++ java
很酷的css菜单
<
html
>
<
head
>
<
STYLE
type
=text/css
>
#navigation
{
}
{
background
:
#99CCFF
;
width
:
715px
;
margin
:
0 auto
;
height
:
38px
;
/**/
/*
hide overflow:hidden from IE5/Mac
*/
/**/
/*
\
*/
overflow
:
hidden
;
/**/
/*
*/
}
#navigation ul
{
}
{
margin
:
0
;
padding
:
0
;
list-style-type
:
none
;
background
:
transparent
;
}
#navigation li
{
}
{
display
:
block
;
float
:
left
;
margin
:
0 1px
;
}
#navigation .snazzy
{
}
{
background
:
transparent
;
}
#navigation .snazzy span
{
}
{
text-align
:
center
;
color
:
#fff
;
margin
:
0
;
font-weight
:
normal
;
}
#navigation .b1, #navigation .b2, #navigation .b3, #navigation .b4
{
}
{
display
:
block
;
font-size
:
1px
;
/**/
/*
hide overflow:hidden from IE5/Mac
*/
/**/
/*
\
*/
overflow
:
hidden
;
/**/
/*
*/
}
#navigation .b1, #navigation .b2, #navigation .b3
{
}
{
height
:
1px
;
}
#navigation .b2, #navigation .b3, #navigation .b4
{
}
{
border-left
:
1px solid #fff
;
border-right
:
1px solid #fff
;
}
#navigation .b1
{
}
{
margin
:
0 5px
;
background
:
#fff
;
}
#navigation .b2
{
}
{
margin
:
0 3px
;
border-width
:
0 2px
;
}
#navigation .b3
{
}
{
margin
:
0 2px
;
}
#navigation .b4
{
}
{
height
:
2px
;
margin
:
0 1px
;
}
#navigation .boxcontent
{
}
{
display
:
block
;
border-left
:
1px solid #fff
;
border-right
:
1px solid #fff
;
}
#navigation a.menu, #navigation a.menu:visited
{
}
{
display
:
block
;
text-decoration
:
none
;
width
:
100px
;
font-family
:
Arial, Helvetica, sans-serif
;
font-size
:
14px
;
}
#navigation a.current span, #navigation a.current:visited span
{
}
{
padding-top
:
10px
;
}
#navigation a.menu:hover
{
}
{
background
:
transparent
;
cursor
:
pointer
;
}
#navigation a.current:hover
{
}
{
cursor
:
default
;
}
#navigation a.menu:hover span
{
}
{
padding-top
:
10px
;
}
#navigation .red
{
}
{
background
:
#c00
;
}
#navigation .orange
{
}
{
background
:
#f90
;
}
#navigation .yellow
{
}
{
background
:
#b8b800
;
}
#navigation .green
{
}
{
background
:
#090
;
}
#navigation .blue
{
}
{
background
:
#00c
;
}
#navigation .indigo
{
}
{
background
:
#309
;
}
#navigation .violet
{
}
{
background
:
#c6c
;
}
#navigation .lace
{
}
{
background
:
#e0e0d5
;
}
#navigation .slate
{
}
{
background
:
#bcdae9
;
}
#navigation .salmon
{
}
{
background
:
#ffa07a
;
}
#navigation .mint
{
}
{
background
:
#f5fffa
;
}
span
{
}
{
background
:
#000
}
</
STYLE
>
</
head
>
<
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
>
查看全文
相关阅读:
深入理解JVM(2)——揭开HotSpot对象创建的奥秘
深入理解JVM(3)——垃圾收集策略详解
深入理解JVM(4)——对象内存的分配策略
深入理解JVM(1)——JVM内存模型
学习 IOC 设计模式前必读:依赖注入的三种实现
学习Struts--Chap07:Struts2文件上传和下载
POJ2823_Sliding Window
POJ3378_Crazy Thairs
POJ2374_Fence Obstacle Course
POJ3709_K-Anonymous Sequence
原文地址:https://www.cnblogs.com/chengulv/p/298541.html
最新文章
hdu_1031_结构体排序
hdu_1028_母函数
hdu_1027(好吧。。。牛。。。next_permutation也可以水过)
opencv+vs配环境
hdu_1026(最短路)
hdu_1025(LIS Nlog(N)算法)
linux:一些工具
skynet源码分析:开始
skynet:cluster
skynet:热更新 lua 代码
热门文章
skynet:控制台管理
skynet源码分析:http
skynet源码分析:运行与主要线程worker
skynet源码分析:模块
skynet源码分析:消息
skynet源码分析:服务
深入理解JVM(9)——类加载的过程
深入理解JVM(6)——JVM性能调优实战
深入理解JVM(10)——Class文件结构
深入理解JVM(8)——类加载的时机
Copyright © 2011-2022 走看看