0

我尝试在 CSS3 PIE 中使用多个背景。它适用于 IE7，但不适用于 IE8。我的意思是在 IE8 中我可以使用 no-repeat、repeat 和 repeat y，但浏览器不会呈现 repeat-x 背景。它是一个错误吗？这是一些代码：

#footer .links li {
    background: url('../images/common/border_dashed.png') repeat-x, 
                url('../images/common/bullet_marker2.png') 9px 17px no-repeat;
    -pie-background: url('_ui/images/common/bullet_marker2.png') 9px 17px no-repeat, 
                     url('_ui/images/common/border_dashed.png') repeat-x;
    behavior: url(PIE.htc);
}

我尝试使用底部/顶部和像素位置。我也在试验 z-index 和 position 值。

4

1 回答 1

1

好的，我不知道 ie8 中的真正问题是什么，但这里有解决方案。对于 IE7 CSS3 PIE 效果很好，我注意到 IE8 支持 :before :)。所以我用它来添加具有背景和适当尺寸的新块元素。它仍然没有显示，所以经过几分钟的实验，我发现 content: "" 解决了这个问题。这是我的一些背景代码（页脚的顶行和页脚之间<li>的行）：

.ie8 #footer:before {
    content: "";
    display: block;
    width: inherit;
    height: 10px;
    background: url('../images/common/border_dashed.png') 0 4px repeat-x;
}

.ie8 #footer li {
    position: relative;
}

.ie8 #footer .nav li a:before,
.ie8 #footer .procedures li a:before,
.ie8 #affiliations ul:before {
    content: "";
    position: absolute;
    display: block;
    width: 212px;
    height: 1px;
    background: url('../images/common/border_dashed.png') 0 0 repeat-x;
}

.ie8 #footer .nav li a:before,
.ie8 #footer .procedures li a:before {
    margin: -10px 0 0 -27px;
}

.ie8 #affiliations ul:before {
    margin-top: -5px;
}
于 2012-08-07T13:38:34.477 回答