一些经典的JAVASCRIP代码收集.docx

纯CSS的下拉导航菜单

[Copy][Run][Save]

body{color:

#fff;}

#wrapper{color:

#000;}

.red{color:

#c00;}

#info{margin-top:

20px;}

#infoh1{font-size:

3em;text-align:

center;font-family:

georgia,"timesnewroman",serif;}

#head{height:

145px;border:

0;}

#positioner{clear:

both;position:

relative;left:

1px;z-index:

100;}

#ads{position:

relative;z-index:

10;}

.menu{display:

none;}

#noniemenu{position:

absolute;}

#noniemenu.holderul{padding:

0;margin:

0;}

#noniemenu.holderulli{list-style-type:

none;}

#noniemenu.holderli{}

#noniemenu.holderliul{display:

none;}

#noniemenu.holderli:

hover>ul#a3{display:

block;position:

absolute;left:

105px;margin-top:

-20px;border:

1pxsolid#000;}

#noniemenu.holder.bold{font-weight:

bold;}

#noniemenu.holder{

color:

#fff;

width:

104px;

height:

18px;

display:

block;

overflow:

hidden;

float:

left;

border:

1pxsolid#000;

margin-right:

1px;

font-size:

12px;

}

#noniemenu.holder:

hover{

height:

auto;

}

#noniemenua.outer,#noniemenua.outer:

visited{

color:

#fff;

width:

104px;

line-height:

18px;

display:

block;

background:

#e09222;

text-align:

center;

text-decoration:

none;

font-family:

verdana,arial,sans-serif;

}

#noniemenua.outer:

hover{

background:

#697210;

overflow:

visible;

}

#noniemenudiv.open{display:

none;}

#noniemenua.inner,#noniemenua.inner:

visited{

display:

block;

width:

104px;

height:

18px;

line-height:

18px;

border-bottom:

1pxsolid#000;

text-decoration:

none;

color:

#000;

background:

#eee;

text-align:

center;

}

#noniemenua.second{font-weight:

bold;}

#noniemenua.inner:

hover{

background:

#add;

}

--[iflteIE6]>

body{margin-top:

-8px;}

#head{height:

147px;}

#noniemenu{display:

none;}

.menu{display:

block;position:

absolute;}

.menua.outer,.menua.outer:

visited{

color:

#fff;

width:

104px;

height:

18px;

display:

block;

background:

#e09222;

border:

1pxsolid#000;

margin-right:

1px;

text-align:

center;

float:

left;

text-decoration:

none;

font-family:

verdana,arial,sans-serif;

font-size:

12px;

line-height:

18px;

overflow:

hidden;

}

.menua.outer:

hover{

background:

#697210;

overflow:

visible;

}

.menua.outer:

hovertable.first{

display:

block;

background:

#eee;

border-collapse:

collapse;

}

.menua.inner,.menua.inner:

visited{

display:

block;

width:

102px;

height:

18px;

border-bottom:

1pxsolid#000;

text-decoration:

none;

color:

#000;

font-family:

verdana,arial,sans-serif;

font-size:

12px;

text-align:

center;

}

.menua.inner:

hover{

background:

#add;

}

.menua.outertable.firsta.second{

height:

18px;

line-height:

18px;

overflow:

hidden;

font-weight:

bold;

}

.menua.outertable.firsta.second:

hover{

position:

relative;

overflow:

visible;

}

.menua.outertable.firsta.second:

hovertable{

position:

absolute;

top:

-2px;

left:

102px;

border-collapse:

collapse;

background:

#eee;

border:

1pxsolid#000;

font-weight:

normal

}

[endif]-->

--[iflteIE6]>

[endif]-->

菜单一

1-01

1-02

1-03

1-04

1-05

1-06

1-07

1-08

1-09

1-10

菜单二

2-1

2-2

2-3

2-4

2-5

2-6

2-7

菜单三

3-1

3-2

3-3

3-4

3-5

菜单四

4-1

4-2

4-3

4-4

4-5

4-6

4-7

菜单五

5-1

5-2

5-3

5-4

5-5

5-6

5-7

5-8

5-9