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

をno-repeatスキップする必要がある場合は、次のような "-imageのみを試してください。background:

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

あなたが使うだけだと言うとき、background:私はあなたが使っていないのでうまくいくと思いますbackground-image

そして多分あなたは試してみるべきです：

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

それが役立つことを願っています!

編集：引用符は必須ではありません

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

同じことですか

于 2013-04-05T10:55:00.300 に答える