0

私の現在のコードは次のとおりです。

CSS:

.submitorder {
background-image: url('https://www.amleo.com/images/art/PON1.jpg');
width: 205px;
height: 52px;
font-size:0px;
}

.submitorder:hover {
background-image: url('https://www.amleo.com/images/art/PON2.jpg');
width: 205px;
height: 52px;
font-size:0px;
}

HTML は次のとおりです。

<div><input type="submit" class="submitorder"/></div>

私がこれを持っているページは次のとおりです: https://www.amleo.com/checkout.aspx

画像を 1 つの画像に結合する必要がありますか? ユーザーが見ているものをホバー時に画像の次の半分に移動するにはどうすればよいですか?

良い/悪い/醜いものを理解しようとしているだけです。:)

ありがとうございました。

4

2 に答える 2

1

css スプライトを見てください: http://css-tricks.com/css-sprites/

次のようなものを作成する必要があります。

あなたのスプライト >

( csssprites.com/で実行)

次に使用します：

.submitorder {
background-image: url('sprite.jpg');
background-position: 0px 0px;
width: 205px;
height: 52px;
font-size:0px;
}

.submitorder:hover {
background-position: 0px -62px;
}
于 2013-01-08T16:21:09.720 に答える
0

あなたはおそらくこのようなものが欲しいでしょう。

http://css-tricks.com/css-sprites/

于 2013-01-08T16:19:08.940 に答える