当鼠标悬停在<button>标签</button>时，如何让光标变为手形

Question

查看我的网站时，光标只会更改为<a>标记的手套，而不是<button>标记。有这个原因吗？

这是我的代码（按钮标签在css3中的ID为#more）。

 #more {
    background:none;
    border:none;
    color:#FFF;
    font-family:Verdana, Geneva, sans-serif;
}

Answer 1

请参阅： https://developer.mozilla.org/en-US/docs/Web/CSS/cursor

因此您需要添加：cursor:pointer;

在您的情况下使用：

#more {
  background:none;
  border:none;
  color:#FFF;
  font-family:Verdana, Geneva, sans-serif;
  cursor:pointer;
}

这会将光标应用于ID为“more”的元素（只能使用一次）。所以在HTML中使用

<input type="button" id="more" />

如果你想将它应用于多个按钮，那么你有多种可能性：

使用CLASS

.more {
  background:none;
  border:none;
  color:#FFF;
  font-family:Verdana, Geneva, sans-serif;
  cursor:pointer;
}

并在您的HTML中使用

<input type="button" class="more" value="first" />
<input type="button" class="more" value="second" />

或适用于HTML背景：

input[type=button] {
  background:none;
  border:none;
  color:#FFF;
  font-family:Verdana, Geneva, sans-serif;
  cursor:pointer;
}

并在您的HTML中使用

<input type="button" value="first" />
<input type="button" value="second" />

Answer 2

只需添加此样式：

cursor: pointer;

默认情况下没有发生这种情况的原因是因为大多数浏览器仅为链接保留指针（也许还有其他一些我忘记的东西，但通常不是<button>）。

有关cursor媒体资源的更多信息：https://developer.mozilla.org/en/CSS/cursor

我通常默认将其应用于<button>和<label>。

注意：我刚抓到这个：

  

按钮标记的ID为#more

每个元素都有自己唯一的id非常重要，你不能有重复。请改用class属性，并将选择器从#more更改为.more。这实际上是一个很常见的错误，这是许多问题和问题的原因。您越早了解如何使用id，就越好。

Answer 3

所有你需要的只是使用CSS的一个属性，即----＆gt;

光标：指针

只需在css中使用此属性，无论是内联还是内部或外部

例如

（对于内联css）

<form>
<input type="submit" style= "cursor:pointer" value="Button" name="Button">
</form>

Answer 4

 #more {
    background:none;
    border:none;
    color:#FFF;
    font-family:Verdana, Geneva, sans-serif;
    cursor: pointer;
}