2

我已经设法让我的标题作为 ff、safari 和 opera 中的链接以及 css 图像替换

#header h1 {
    background-image: url(../images/logo.png);
    background-repeat: no-repeat;
    text-indent: -9999px;
    margin-left: 15px;
}
#header h1 a {
    display: block;
    height: 120px;
    width: 400px;
    margin-top: -135px;
}

我正在尝试在 IE 中优化该网站，这是我在周一启动它之前的最后一步，但徽标根本没有出现在 IE 8 或 9 中，但它在 IE 7 中却非常令人惊讶。我设法得到了通过使 display inline-block 出现在 IE9 中的徽标

.ie9 #header h1 {
    background-image: url(../images/logo.png);
    background-repeat: no-repeat;
    text-indent: -9999px;
    margin-left: 15px;
}

.ie9 #header h1 a {
    display: inline-block;
    height: 120px;
    width: 400px;
    margin-top: -135px;
}

当我这样做时，图像不再是链接，有人知道如何解决这个问题吗？我会将图像放在 HTML 中，而不是使用图像替换，但是从 SEO 的角度来看，使用图像替换更好。

4

1 回答 1

0

我认为这是margin-top: -135px造成问题的原因。高度只有 120 像素，所以它最终会是 -15 像素（高度 - 边距），因此会消失在 H1 标签的底部下方。

于 2012-10-18T15:43:06.283 回答