我使用http://css3pie.com/在创建我的ie8按钮时,这是我的代码
.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; }
但是它重复了背景图像,尽管我将其设置为无重复。另外,如果我删除了馅饼 - 背景,则背景图像不会重复,而是丢失了梯度。我在这里做错了什么?派是否同时支持背景梯度和背景图像?
您需要设置一个单独的规则,以保持所有图像的无重复值,例如: background-repeat:no-repeat
您不应该这样使用:
url("../img/arrow_white.png"), linear-gradient(#135496, #12408d)no-repeat !important;
但使用这样的使用:
url("../img/arrow_white.png") no-repeat, linear-gradient(#135496, #12408d) !important;