IE8背景图像显示不正确

时间:2014-03-10 08:14:18

标签: jquery html css internet-explorer-8

我在为IE8创建按钮时使用了http://css3pie.com/,这是我的代码

.mybutton


{
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    background: #135496;
    background: url("../img/arrow_white.png"),-webkit-gradient(linear, 0 0, 0 bottom, from(#135496), to(#12408d))no-repeat !important;
    background: url("../img/arrow_white.png"),-webkit-linear-gradient(#135496,
#12408d)no-repeat !important;
    background: url("../img/arrow_white.png"),-moz-linear-gradient(#135496,
#12408d)no-repeat !important;
    background: url("../img/arrow_white.png"), -ms-linear-gradient(#135496, #12408d)no-repeat !important;
    background: url("../img/arrow_white.png"),-o-linear-gradient(#135496,
#12408d)no-repeat !important;
    background: url("../img/arrow_white.png"), linear-gradient(#135496, #12408d)no-repeat !important;
    -pie-background: url("../img/arrow_white.png"), linear-gradient(#135496, #12408d)no-repeat !important;
    behavior: url("../img/PIE.htc");
    background-position: 50% 50%;
    position: relative;
    z-index: 1;
    filter: none !important; }

但它重复了背景图像,虽然我把它设置为不重复。此外,如果我删除饼背景,背景图像不会重复,而是缺少渐变。 我在这做错了什么?派是否同时支持背景渐变和背景图像?

2 个答案:

答案 0 :(得分:1)

您需要设置单独的规则,以保留所有图片的无重复值,如下所示:background-repeat:no-repeat

答案 1 :(得分:0)

你不应该这样使用:

url("../img/arrow_white.png"), linear-gradient(#135496, #12408d)no-repeat !important;

但是这样使用:

url("../img/arrow_white.png") no-repeat, linear-gradient(#135496, #12408d) !important;