2
我在CSS中开发了一个下拉菜单，但它似乎并没有在Safari中工作，但在任何其他浏览器上都能正常工作，任何人都可以在代码中看到问题？下拉不能在Safari下工作
它是使用简单的CSS shoulden't会造成任何问题
#nav {
position:relative;
margin:0 auto;
}
ul#navigation {
}
ul#navigation li {
display:inline;
float:left;
position:relative;
}
ul#navigation li a {
]}
ul#navigation li a:hover {
}
ul#navigation li:hover > a {
}
/* Drop-Down Navigation */
ul#navigation li:hover > ul
{
visibility:visible;
opacity:1;
}
ul#navigation ul, ul#navigation ul li ul {
list-style: none;
margin: 0;
padding: 0;
visibility:hidden;
position: absolute;
z-index: 99999;
width:180px;
background-image: linear-gradient(bottom, rgb(64,119,149) 28%, rgb(64,119,149) 32%, rgb(83,153,186) 85%);
background-image: -o-linear-gradient(bottom, rgb(64,119,149) 28%, rgb(64,119,149) 32%, rgb(83,153,186) 85%);
background-image: -moz-linear-gradient(bottom, rgb(64,119,149) 28%, rgb(64,119,149) 32%, rgb(83,153,186) 85%);
background-image: -webkit-linear-gradient(bottom, rgb(64,119,149) 28%, rgb(64,119,149) 32%, rgb(83,153,186) 85%);
background-image: -ms-linear-gradient(bottom, rgb(64,119,149) 28%, rgb(64,119,149) 32%, rgb(83,153,186) 85%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.28, rgb(64,119,149)),
color-stop(0.32, rgb(64,119,149)),
color-stop(0.85, rgb(83,153,186))
);
box-shadow:1px 1px 3px #ccc;
opacity:0;
-webkit-transition:opacity 0.2s linear, visibility 0.2s linear;
-moz-transition:opacity 0.2s linear, visibility 0.2s linear;
-o-transition:opacity 0.2s linear, visibility 0.2s linear;
transition:opacity 0.2s linear, visibility 0.2s linear;
}
ul#navigation ul {
top: 43px;
left: 1px;
}
ul#navigation ul li ul {
top: 0;
left: 181px;
}
ul#navigation ul li {
clear:both;
width:100%;
border:0 none;
}
ul#navigation ul li a {
background:none;
padding:7px 15px;
color:#ffffff;
text-decoration:none;
display:inline-block;
border:0 none;
float:left;
clear:both;
width:150px;
font-size: 12px;
font-family: Tahoma;
}
ul#navigation ul li a:hover {
background:none;
padding:7px 15px;
color:#ffffff;
text-decoration:none;
display:inline-block;
border:0 none;
float:left;
clear:both;
width:150px;
font-size: 14px;
font-family: Tahoma;
}
ul#navigation li a.first {
border-left: 0 none;
}
ul#navigation li a.last {
border-right: 0 none;
}
移除UL＃导航李方括号一个 – SVS
提交你的html＆css在www.jsfiddle.net – SVS
你声明css不应该导致问题，但是它是导致这个问题的原因：1）你已经获得ul＃navigation ul的声明在声明之后被隐藏使其可见（所以隐藏的声明覆盖可见的声明），所以这是一个问题。 2）你不会为ul＃navigation ul声明顶部/左边，3）使用'left'属性显示/隐藏列表可能比'visiblity'属性更好：要隐藏，'left ：-999em;'，显示，'left：0;' –