css - 悬停 标签时如何让光标变为手形

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" />

如果你想将它应用到多个按钮，那么你有不止一种可能性:

使用类

.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" />