Question

大家好，我的样式表有一些跨浏览器问题，即8。

下面的css在我的chrome / ff样式表中工作正常，但它对于我的样式表根本不起作用。

#threetwoBTN {
background-repeat: no-repeat;
background-image: url('../images/32Button_BG01.png');
}
a#threetwoBTN:hover {
background-repeat: no-repeat;
background-image: url('../images/32Button_BG02.png');
}

在IE中，下面是我能得到的。

#threetwoBTN {
background-repeat: no-repeat;
background-image: url('../images/32Button_BG01.png');
}

我可以应用我的背景图片及其相关内容，我想要的悬停效果在上面工作并不适用于IE8。以下是我的标签的结构：

    <div class="ContentBody">
    <div class="LeftContentBody">
        <br/>
            <!-- another div but ignored for example! -->
        <br />
        <a id="threetwoBTN">Download 32-Bit</a>
        <p>
            * ...
        </p>

设置为每个“a”标记的id允许我按照每个标记具有不同背景和效果等的方式来定位和设置每个锚点的样式。有人可以帮我解释一下这个与IE相关的问题吗？

更新：

文本从页面缩进，因此用户看不到锚标记之间的文本。这意味着按钮由背景图像组成。为了清楚起见，我已经粘贴在我用来设置锚标签的CSS下面。

.LeftContentBody a {
font-size: 10px;
text-indent: -1500px;
width: 124px;
height: 62px;
border: 2px solid #000000;
margin-left: 32px;
margin-bottom: 32px;
float: left;
clear: left;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
}

Answer 1

您应该将属性href添加到您的代码中，尝试使用＃，它应该可以使用，至少它适用于我。

希望它有所帮助。

#threetwoBTN 
{ 
    background: #CCC;     
} 
#threetwoBTN:hover {
    background: #AAA;
}

<div class="ContentBody">     
<div class="LeftContentBody">         
    <br/>            
     <!-- another div but ignored for example! -->         
    <br />        
    <a href="#" id="threetwoBTN">Download 32-Bit</a>         
    <p>* ...</p> 
</div>
</div>

Answer 2

这是一个位于文本旁边的图像，还是要替换文本？

如果要替换文本，你给它宽度/高度和显示块吗？

需要一些帮助修复IE8中的CSS问题？

2 个答案: