4

フォーカス時にテキスト ボックスに素敵なボックス アウトラインを追加しましたが、ホバー時に灰色のアウトラインを追加したいのですが、問題が発生しました。テキストボックスが選択されていない場合、ホバー時にボックスを表示する必要があります。これを行う方法はありますか?ありがとう。=)

input:focus{
    outline: none;
    box-shadow: 0px 0px 5px #61C5FA;
    border-color: #5AB0DB;
}

input:hover {
    border: 1px solid #999;
    border-radius: 5px;
}
4

1 に答える 1

15
input[type="text"]:focus{
outline: none;
box-shadow: 0px 0px 5px #61C5FA;
border:1px solid #5AB0DB;
}

input[type="text"]:hover{
border: 1px solid #999;
border-radius: 5px;
}

input[type="text"]:focus:hover{
outline: none;
box-shadow: 0px 0px 5px #61C5FA;
border:1px solid #5AB0DB;
border-radius:0;

}    ​

http://jsfiddle.net/calder12/jCaGp/1/

タイプを上記のように設定することを強くお勧めします。そうしないと、すべての入力要素 (ボタン、選択など) がこれらの効果を持ちます。

于 2012-10-24T19:25:08.550 に答える