gpt4 book ai didi

CSS 列表菜单在 Internet Explorer 7 中无法正常工作

转载 作者:太空宇宙 更新时间:2023-11-04 15:59:51 26 4
gpt4 key购买 nike

我的 CSS 菜单在 IE7 中无法正常工作。它在 IE8 和所有其他浏览器中工作正常。

在 IE7 中,下拉菜单向右倾斜,如图所示。

这是菜单: http://testsitefree.nfshost.com/

感谢您的帮助。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title> test</title>
<style type ="text/css">

#test {
position:absolute;
left:710px;
top:0px;
font-family:tahoma, verdana, arial, helvetica, sans-serif;
font-size:10px;
z-index:200;
}

body { behavior:url(csshover.htc); }

#test .abab {
background:green;
}

#test p a {
color: #000;
text-decoration:underline!important;
}

#test a {
color:#fff;
text-decoration:none;
}

#test a.number {
color:#2f343a;
}

#test p a:hover {
text-decoration: none!important;
}

ul#test {
list-style: none;
padding: 0;
margin: 0;
}


ul#test li a {
display: block;
font-weight: normal;
padding: 1px;
background:#fff;
}

ul#test li a:hover{
background:#2f343a;
color:#fff;
list-style:none;
}

#test li {
float: left;
position: relative;
width: 90px;
text-align: center;
margin-right:0px;
border:0px solid #ccc;
}

ul#test li.current a {
background:#ccc;
}

ul#test li.current a:hover {
background:#ccc;
}

#test li ul {
display: none;
width:90px;
top: 18px;
left: 0;
font-weight: normal;
font-size:9px;
text-align:left;
padding-left:0;
margin-left:0;
position:absolute;
}

ul#test li ul.sub1 li, ul#test li ul.sub2 li, ul#test li ul.sub3 li {
border-width:0px 1px 1px 1px!important;
width:88px;
}

ul#test li ul.sub1 li a.number, ul#test li ul.sub2 li a.number, ul#test li ul.sub3 li a.number {
font-weight: normal!important;
counter-increment:image;
padding-left:20px;
background-image:url(small.jpg);
background-repeat:no-repeat;
}


ul#test li ul.sub1 li.img1 a{
background-position: 0px 0px;
}

ul#test li ul.sub1 li.img2 a{
background-position: 0px -13px;
}


ul#test li ul.sub1 li.img3 a{
background-position: 0px -26px;
}

ul#test li ul.sub1 li.img4 a{
background-position: 0px -39px;
}

ul#test li ul.sub1 li.img5 a{
background-position: 0px -52px;
}

#test li>ul {
top: auto;
left: auto;
}

#test li:hover ul, li.over ul {
display: block;
}

#test .sub1 li, #test .sub2 li, #test .sub3 li {
list-style:none;
text-align:left;
}

</style>

</head>
<body>
<ul id="test">

<li><a class="abab" href="content/testpopular.php" title="Menu">TEST</a>
<ul class="sub1">
<li class="img1"><a class="number" href="#" title="Number1">Number1</a></li>
<li class="img2"><a class="number" href="#" title="Number2">Number2</a></li>
<li class="img3"><a class="number" href="#" title="Number3">Number3</a></li>
<li class="img4"><a class="number" href="#" title="Number4">Number4</a></li>
<li class="img5"><a class="number" href="#" title="Number5">Number5</a></li>
</ul>
</li>
</ul>

</body>
</html>

最佳答案

当您使用 margin 或 padding 属性时,然后添加另一个带有 * 的属性表示为 margin/padding 属性创建副本并在属性前添加 *。

例如。

*padding-left:20;

此属性仅在 IE7 中执行,因此您可以为它们赋予单独的值。

关于CSS 列表菜单在 Internet Explorer 7 中无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9958434/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com