web-dev-qa-db-ja.com

CSS：HTML送信ボタンにカーソルを合わせます

CSSでHTML送信ボタンのスタイルを設定しようとしています。

HTML：

<input type="submit" value="Yes" id="popUpYes">"

CSS：

#popUpYes
{
  width: 60px;
  height: 30px;
  background-color: black;
}
#popUpYes:hover
{
  background-color: white;
}

基本的なスタイルは機能しますが、ホバーしても背景の色は変わりません。

htmlcssbuttonsubmit
4
Juicy

あなたの元のコードは私のために働きます。送信ボタンによって継承された他の競合するスタイルがないことを確認してください。

3
userDEV

これを試してください JSfiddle

これを試して：

   #popUpYes
    {
      width: 60px;
      height: 30px;
      background-color: black;
      color: white; /* SET COLOR IN WHITE */
    }

    #popUpYes:hover
    {
      background-color: white;
      color: black; /* SET COLOR IN BLACK */
    }    

     
 <input type="submit" value="Yes" id="popUpYes">

テキストにcolor-属性を割り当てる必要があります。

2
Black Sheep

私はこれを試しましたChromeそしてそれはうまくいきました。

これを試して：

   #popUpYes
            {
              width: 60px;
              height: 30px;
              background-color: black; color:#fff;

            }
        #popUpYes:hover
        {
          background-color: white;
        }   

        
 <input type="submit" value="Yes" id="popUpYes">
1
dotNetE

現在のコードは機能します-> http://jsfiddle.net/2wYqd/ お使いのブラウザは何ですか？

#popUpYes {
  width: 60px;
  height: 30px;
  background-color: black;
}
#popUpYes:hover {
  background-color: white;
}
0
Krasimir

正常に動作しています リンク

#popUpYes {
   width: 60px;
   height: 30px;
   background-color: black;
   color:white;
}
#popUpYes:hover {
   background-color: white;
   color: black;
}
0
Naveen Kumar Alonekar

あなたの質問によると、「基本的なスタイルは機能しますが、ホバーしても背景の色は変わりません。」 、これは、プロパティを介してBackColorまたはbackground-colorを設定した場合にのみ発生します。プロパティの代わりにcssクラスを使用しているため、コードは正常に機能します。

0
Anoop B.K