0

我的CSS：

background-image: url(/images/framework/arrow-down-small.png) no-repeat center; /* fallback */
                background-image: url(/images/framework/arrow-down-small.png) no-repeat center, -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ccc)); /* Saf4+, Chrome */
                background-image: url(/images/framework/arrow-down-small.png) no-repeat center, -webkit-linear-gradient(top, #eee, #ccc); /* Chrome 10+, Saf5.1+ */
                background-image: url(/images/framework/arrow-down-small.png) no-repeat center,    -moz-linear-gradient(top, #eee, #ccc); /* FF3.6+ */
                background-image: url(/images/framework/arrow-down-small.png) no-repeat center,     -ms-linear-gradient(top, #eee, #ccc); /* IE10 */
                background-image: url(/images/framework/arrow-down-small.png) no-repeat center,      -o-linear-gradient(top, #eee, #ccc); /* Opera 11.10+ */
                background-image: url(/images/framework/arrow-down-small.png) no-repeat center,         linear-gradient(top, #eee, #ccc); /* W3C */

我想要的只是一个背景图像和一个渐变。HTML 元素是：

<input type="button" class="mybutton" />

但

  • 背景图像根本不显示
  • 渐变不存在

绝对路径是正确的，因为如果我尝试一个没有渐变的简单 background:url(...) 图像就在那里。

怎么了？

谢谢伯恩哈德

4

1 回答 1

0

With no-repeat you should skip the -image, try only with background:", such as :

background-image: url('image.png') no-repeat; /* Doesn't work */
background-image: url('image.png'); /* Works */

When you say you use only background: I think it does work because you aren't using background-image

And maybe you should try :

<input type = "image" class = "mybutton"/>

Hope that helps !

EDIT : Quotes are not mandatory

background-image: url(image.png);
background-image: url("image.png");
background-image: url('image.png');

Is the same thing

于 2013-04-05T10:55:00.300 回答