Hover上的HTML按钮标签样式

我正在使用HTML按钮标签，但下面提到的样式应该只应用于顶部菜单，而不是网站中的其他按钮标签。我尝试使用的代码button.menuButton:hover，但它不工作Hover上的HTML按钮标签样式

<button id="menuButton" type="button" name="menuButton" title="Logout"> 
<img src="images/commonicons/logout.png" alt="Logout" id="imgLogout" /><br /><b>Logout</b> 
</button>

和应用下面的风格，它会显示在底边框的山脊两侧的石灰颜色和其余的将在虚线模式。

button:hover 
{ 
    border: 1px dashed #CCCCCC; 
    border-bottom: 2px ridge Lime; 
}

任何帮助，非常感谢。

来源

2012-04-09 Yashman Gupta

Ch ange按钮：悬停到按钮＃menuButton：悬停，它会正常工作 – gout 2012-04-11 04:13:46

@gout更好的是，只有'#menuButton：hover'-因为你有一个ID，所以没有必要给一个标签名称。 – 2013-10-26 04:09:09

如果您希望样式仅应用于特定按钮，则应仅在这些按钮标签中指定一个类。例如：
这是Button类：

.mybutton 
{ 
    border: 1px dashed #CCCCCC; 
    border-bottom: 2px ridge Lime; 
}

虽然宣称按钮：

此按钮将有风格：

<button id="menuButton" type="button" name="menuButton" class="mybutton" title="Logout"> 
    <img src="images/commonicons/logout.png" alt="Logout" id="imgLogout" /><br  /><b>Logout</b> 
</button>

此按钮将不会有款式：

<button id="menuButton" type="button" name="menuButton"title="Logout"> 
     <img src="images/commonicons/logout.png" alt="Logout" id="imgLogout" /><br  /><b>Logout</b> 
    </button>

来源

2012-04-09 08:27:45 Ashwin

老板为什么既是id又是类？他们中的任何一个都够了。 – gout 2012-04-11 04:15:35

@ gout：因为提问者在他的问题中使用了id，我只是让它在那里。 – Ashwin 2012-04-11 04:29:28

老板thukiralaama（反对票）？ – suraj 2012-04-11 04:32:26

如果你想使用button.menuButton:hover那么你的按钮将需要.menuButton类。

<button [...] class="menuButton">

在CSS中，点（。）表示您指的是元素上的类名。

来源

2012-04-09 08:21:30

@Yashman Gupta：如果您希望样式仅应用于特定按钮，则应仅在这些按钮标签中指定一个类。例如： – Ashwin 2012-04-09 08:24:49

感谢Ashwin＆Jamie – 2012-04-09 08:28:35

@YashmanGupta：不客气:) – Ashwin 2012-04-09 08:34:41

Hover上的HTML按钮标签样式

回答

相关问题