如何在将鼠标悬停在<button>标签上时将光标更改为手

Question

查看我的网站时,光标只会更改为戴手套的<a>标签,而不是<button>标签.是否有一个原因？

这是我的代码(按钮标签在css3中的ID为#more).

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

Answer 1

所以你需要添加: 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>s).

我通常适用这<button>和<label>默认.

注意:我刚抓到这个:

按钮标签的ID为 #more

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

Answer 3

你只需要使用CSS的一个属性,即---->

光标:指针

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

例如(对于内联css)

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