MutilMenu.css
4.6 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
/* Based partially on Matthew Carroll's keyboard accessible flavor of Suckerfish
* Dropdowns by Patrick Griffiths and Dan Webb.
* http://carroll.org.uk/sandbox/suckerfish/bones2.html
*/
/* ----[ LINKS ]----*/
/* all menu links */
#subMenusContainer a{
font-family: 微软雅黑 !important;
font-size: 12px !important;
font-weight: bold;
color: #404040 !important;
text-decoration:none;
display:block;
padding:6px 0px 6px 9px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
width: 146px;
}
/* Just main menu links --[for non-javascript users this applies to submenu links as well]
#nav a{
margin:0;
float:left;
}*/
/* Just sub menu links */
#subMenusContainer a, #nav li li a{
text-align:left;
}
/* All menu links on hover or focus #nav a:hover, #nav a:focus,#nav a.mainMenuParentBtnFocused, */
#subMenusContainer a:hover,
#subMenusContainer a:focus,
#subMenusContainer a.subMenuParentBtnFocused{
background-color:#2492FF ;/**#F6C739 ;*/
color:#FFF;
}
/* sub menu links on hover or focus
#subMenusContainer a:hover,
#subMenusContainer a:focus,
#nav a.mainMenuParentBtnFocused,
#subMenusContainer a.subMenuParentBtnFocused,
#nav li a:hover,
#nav li a:focus{
background-color:#2492FF ;/**#F6C739 ;*/
color:#FFF;
}*/
/* Parent Sub Menu Links ---[javascript users only]*/
.subMenuParentBtn{
background: url(/wui/theme/office/page/images/btn/arrow_right.png) right center no-repeat;
}
/* Parent Sub Menu Links on hover or focus ---[javascript users only]*/
.subMenuParentBtnFocused{
background: url(/wui/theme/office/page/images/btn/arrow_right_over.png) right center no-repeat;
}
/* Parent Main Menu Links ---[javascript users only]*/
.mainMenuParentBtn{
}
/* Parent Main Menu Links on hover or focus ---[javascript users only]*/
.mainMenuParentBtnFocused{
}
.mainMenuParentBtnFocused .menu1{
background:url('/wui/theme/office/page/images/btn/btn1.png') !important;
}
/* ----[ OLs ULs, LIs, and DIVs ]----*/
/* Submenu Outer Wrapper - each submenu is inside a div with this class - javascript users only */
.smOW{
display:none;
position: absolute;
overflow:hidden;
/*the 2px left & right padding lets you have a 1px border
on the ul or ol inside since overflow is set to hidden*/
padding:0 2px;
margin:0 0 0 -2px;
}
/* All ULs and OLs */
#nav, #nav ul, #nav ol, #subMenusContainer ul, #subMenusContainer ol {
padding: 0;
margin: 0;
list-style: none;
line-height: 1em;
}
/* All submenu OLs and ULs */
#nav ol, #nav ul, #subMenusContainer ul, #subMenusContainer ol {
/*border around submenu goes here*/
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
background:#fff;
border:1px solid #EFEFEF;/** #C3D46A;*/
left:0;
}
#subMenusContainer ul{
z-index:10000 !important;
}
/* List items in main menu --[for non-javascript users this applies to submenus as well] */
#nav li {
/*great place to use a background image as a divider*/
display:block;
list-style:none;
position:relative;
float:left;
}
#subMenusContainer li{
list-style: none;
background: url('/wui/theme/office/page/images/btn/ulbg.png') repeat-y;
}
/* main menu ul or ol elment */
#nav{
display:block;
position: absolute;
list-style:none;
margin:0 0 0 0;
top:77px;
left:0px;
display:block;
list-style:none;padding:0;width:100%; background:url(/wui/theme/office/page/images/bg/navbg.png) repeat-x; font-weight:bold;
}
#subMenusContainer{ display:block; position:absolute; top:0; left:0; width:100%; height:0; overflow:visible; z-index:1000000000; }
/* --------------------------[ The below is just for non-javscript users ]--------------------------*/
#nav li li{ float:none; }
#nav li li a{ /* Just submenu links*/
position:relative;
float:none;
}
#nav li ul { /* second-level lists */
position: absolute;
width: 10em;
margin-left: -1000em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
margin-top:2.2em;
}
#nav li ul a{font-size:11px;}
/* third-and-above-level lists */
#nav li ul ul { margin: -1em 0 0 -1000em; }
#nav li:hover ul ul { margin-left: -1000em; }
/* lists nested under hovered list items */
#nav li:hover ul{ margin-left: 0; }
#nav li li:hover ul { margin-left: 10em; margin-top:-2.5em;}
/* extra positioning rules for limited noscript keyboard accessibility */
#nav li a:focus + ul { margin-left: 0; margin-top:2.2em; }
#nav li li a:focus + ul { left:0; margin-left: 1010em; margin-top:-2.2em;}
#nav li li a:focus {left:0; margin-left:1000em; width:10em; margin-top:0;}
#nav li li li a:focus {left:0; margin-left: 2010em; width: 10em; margin-top:-1em;}
#nav li:hover a:focus{ margin-left: 0; }
#nav li li:hover a:focus + ul { margin-left: 10em; }