0

入力テキストがあります。input要素よりも小さい背景画像を追加しました。画像にカーソルを合わせただけで画像を変更したい。

これは私のCSSです：

#inputBox2{
    top:45%;
    background-image:url(".\\Images\\arrow.png");
    background-repeat: no-repeat;
    background-size: 14% 100%;
    background-position: right;
}

編集：私はこれをやろうとしています：ここに画像の説明を入力してください

矢印にカーソルを合わせると色が変わり、クリックすると送信されます

4

2 に答える 2

1

:hover要素の一部にcssを使用することはできません。つまり、基本的に、いいえ、あなたがやろうとしていることをすることはできません。少なくともあなたがやりたい方法ではありません。

ただし、スタイル付きsubmitボタンを使用すると、同じ効果を得ることができます。とにかくユーザーが入力テキストボックスの背景にある画像をクリックしたときにフォームを送信したいのはなぜですか？それは意味的には間違っています。

<label>「パスワード」ラベルにタグを使用<input type="password"/>し、パスワード入力に<input type="submit"/>タグを使用し、送信ボタンにタグを使用します。次に、CSSを使用して送信ボタンのスタイルを設定し、目的の効果を実現できます。

于 2013-03-09T18:16:06.517 に答える
0

背景画像が矢印に設定されている別のインライン要素（またはフロートブロック要素）が必要です。次に、その要素で：hoverを使用できます。

（または、この要素は<image>、ホバープロパティを持つ要素である可能性があります。）

于 2013-03-09T18:20:04.487 に答える