关于html:CSS下拉菜单问题

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

#menu {

    height:55px;
background-color: #000;

    width:100%;
top:0px;
left:0px;
z-index:101;
text-align:center;
text-transform:uppercase;
position:relative;
}

.menulinks {
float:right;
}

#menucontainer {

    margin: 0 auto;

    width:900px;

    font-family: 'Open Sans', sans-serif;
}

#menucontainer a {
color:#fff;
}

#menucontainer a:hover {
color:#fff;
}

#menucontainer ul {
list-style: none;
padding:7px;
color:#A4A4A4;
}

#menucontainer ul a {
color:#848484;
}

#menucontainer li a {
color:#848484;
}

#menucontainer li {
display: inline;
margin-right:3px;
margin-left:3px;
padding:3px;
color:#848484;
}

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

ul {

  text-align: left;

  display: inline;

  margin: 0;

  padding: 15px 4px 17px 0;

  list-style: none;

  border: 1px solid;
}

ul li {

  display: inline-block;

  margin-right: -4px;

  position: relative;

  padding: 15px 20px;

  background: #fff;

  cursor: pointer;
}

ul li:hover {

  background: #262222;

  color: #fff;
}

ul li ul {

  padding: 0;

  position: absolute;

  top: 48px;

  left: 0;

  width: 150px;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  box-shadow: none;

  display: none;

  opacity: 0;

  visibility: hidden;
}

ul li ul li {

  background: #262222;

  display: block;

  color: #fff;

  text-shadow: 0 -1px 0 #000;
}

ul li ul li:hover {

  background: #a1a1a1;
}

ul li:hover ul {

  display: block;

  opacity: 1;

  visibility: visible;
}

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

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

    Simple Pure CSS Drop Down Menu