Question

我正在尝试在CSS中设置HTML提交按钮的样式：

HTML：

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

CSS：

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

基本样式有效，但背景在悬停时不会改变颜色。

Answer 1

您的原始代码适合我。请确保您没有提交按钮继承的任何其他冲突样式。

Answer 2

试试这个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 - 属性。

Answer 3

现在的代码有效 - ＆gt; http://jsfiddle.net/2wYqd/您的浏览器是什么？

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

Answer 4

工作正常link

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

Answer 5

我试过这是Chrome，它确实有效。

试试这个：

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

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

Answer 6

根据您的问题“基本样式有效但背景在悬停时不会改变颜色。” ，只有在通过属性设置BackColor或背景颜色时才会发生这种情况。您的代码工作正常，因为您使用了css类而不是属性。

CSS：悬停HTML提交按钮

6 个答案: