当鼠标移过表格中的一行时,将光标更改为手形

Question

如何改变光标指针的手时,我的鼠标越过一个<tr>在<table>

<table class="sortable" border-style:>
  <tr>
    <th class="tname">Name</th><th class="tage">Age</th>
  </tr>
  <tr><td class="tname">Jennifer</td><td class="tage">24</td></tr>
  <tr><td class="tname">Kate</td><td class="tage">36</td></tr>
  <tr><td class="tname">David</td><td class="tage">25</td></tr>
  <tr><td class="tname">Mark</td><td class="tage">40</td></tr>
</table>

Answer 1

你可以用CSS实际做到这一点.

.sortable tr {
    cursor: pointer;
}

Answer 2

我搜索了一些bootstrap样式,发现了这个:

[role=button]{cursor:pointer}

所以我假设你可以得到你想要的东西:

<span role="button">hi</span>

Answer 3

我发现最简单的方法是添加

style="cursor: pointer;"

到你的标签.

Answer 4

添加cursor: pointer到您的CSS.

Answer 5

我将它添加到我的style.css来管理光标选项:

.cursor-pointer{cursor: pointer;}
.cursor-croshair{cursor: crosshair;}
.cursor-eresize{cursor: e-resize;}
.cursor-move{cursor: move;}

Answer 6

为了与IE <6兼容,请按以下顺序使用此样式:

.sortable:hover {
    cursor: pointer;
    cursor: hand;
}

但请记住,IE <7 :hover仅支持带有<a>元素的伪类.

Answer 7

cursor: pointer;在CSS中使用您希望光标更改的元素的样式.

在您的情况下,您将使用(在您的.css文件中):

.sortable {
    cursor: pointer;
}

Answer 8

像这样使用CSS 游标属性:

<table class="sortable">
  <tr>
    <th class="tname">Name</th><th class="tage">Age</th>
  </tr>
  <tr style="cursor: pointer;"><td class="tname">Jennifer</td><td class="tage">24</td></tr>
  <tr><td class="tname">Kate</td><td class="tage">36</td></tr>
  <tr><td class="tname">David</td><td class="tage">25</td></tr>
  <tr><td class="tname">Mark</td><td class="tage">40</td></tr>
</table>

当然,您应该将样式放入CSS文件并将其应用于类.

Answer 9

内联样式示例：

<table>
  <tr> <td style="cursor: pointer;">mouse me over: pointer</td> </tr>
  <tr> <td style="cursor: wait;">mouse me over: wait</td> </tr>
  <tr> <td style="cursor: zoom-in;">mouse me over: zoom-in</td> </tr>
</table>