1

フォームの送信ボタンがあります。背景としてスプライトを使用し、ホバーすると、ホバー効果を得るためにボタンの幅全体に背景をシフトします。ただし、これは機能していません。

これは私のhtmlです：

<form class="a">
<All the other Fields...>
<p><input type="submit" value="Submit"/><p>
</form>

そして私のCSS：

.a input[type="submit"] {
    margin-top: 15px;
    background: url(btn.png) no-repeat;
    width: 108px;
    height: 42px;
    border: none;
    color: transparent;
    font-size: 0;
}

.a input[type="submit"]:hover {
    background: url(btn.png) no-repeat 109 0;
}
4

3 に答える 3

2 
.a input[type="submit"]:hover {
    background: url('btn.png') no-repeat 109px 0px; /*use 109px   */
}

背景画像のパスを確認してください。

于 2012-07-31T04:26:11.503 に答える
1

背景位置：for x: %|px|left|center|rightおよびfor y %|px|top|center|bottom

かもしれない

.a input[type="submit"]:hover {
    background: url(btn.png) no-repeat;
    background-position: 109px 0px; // left 109px, top 0px
}

または

.a input[type="submit"]:hover {
    background: url(btn.png) no-repeat 109px 0px;
}

また、あなたのimage道が正しいことを確認してください。cssによると、今のところ、あなたの画像はあなたがいるのと同じフォルダにあるはずurl(btn.png)です。

于 2012-07-31T04:20:24.683 に答える
0

あなたはpx自分の立場を失っています。実用的な例については、このフィドルを参照してください

于 2012-07-31T04:20:02.287 に答える