Html 当鼠标移过表格中的一行时，将光标更改为手形
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9287693/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Change cursor to hand when mouse goes over a row in table
提问by Zeeshan Rang
How do I change the cursor pointer to hand when my mouse goes over a <tr>in a <table>
当我的鼠标移过 a 时，如何将光标指针更改为手<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>
回答by dangerChihuahua007
You can do this with CSS actually.
你实际上可以用 CSS 做到这一点。
.sortable tr {
cursor: pointer;
}
回答by Ivan
I've searched bootstrap styles a bit and found this:
我搜索了一些 bootstrap 样式，发现了这个：
[role=button]{cursor:pointer}
So I assume you can get what you want with:
所以我假设你可以得到你想要的：
<span role="button">hi</span>
回答by Ira Herman
The easiest way I've found is to add
我发现的最简单的方法是添加
style="cursor: pointer;"
to your tags.
到你的标签。
回答by James Montagne
Add cursor: pointerto your css.
添加cursor: pointer到您的CSS。
回答by xackobo
I added this to my style.css to manage cursor options:
我将此添加到我的 style.css 以管理光标选项：
.cursor-pointer{cursor: pointer;}
.cursor-croshair{cursor: crosshair;}
.cursor-eresize{cursor: e-resize;}
.cursor-move{cursor: move;}
回答by UbiQue
For compatibility with IE < 6 use this style in that order:
为了与 IE < 6 兼容，请按以下顺序使用此样式：
.sortable:hover {
cursor: pointer;
cursor: hand;
}
But remember that IE < 7 supports :hoverpseudoclass only with <a>element.
但请记住，IE < 7:hover仅支持带有<a>元素的伪类。
回答by Chetan
Use the style cursor: pointer;in the CSS for the element you want the cursor to change on.
使用样式cursor: pointer;在CSS你想要的光标来改变的元素。
In your case, you would use (in your .css file):
在您的情况下，您将使用（在您的 .css 文件中）：
.sortable {
cursor: pointer;
}
回答by EverPresent
Use the CSS cursorproperty like so:
像这样使用 CSS cursor属性：
<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>
Of course you should put the style into your CSS file and apply it to the class.
当然，您应该将样式放入 CSS 文件并将其应用于类。
回答by The Alpha
Using css
使用 css
table tr:hover{cursor:pointer;} /* For all tables*/
table.sortable tr:hover{cursor:pointer;} /* only for this one*/
回答by Renu
for just a standard the above solutions work, but if you are using datatables, you have to override the default datatatables.css settings and add the following code to custom css, In the code below row-select is the class that I added on datatables as shown in the html.
对于标准，上述解决方案有效，但如果您使用数据表，则必须覆盖默认的 datatables.css 设置并将以下代码添加到自定义 css，在下面的代码中，row-select 是我在数据表上添加的类如html所示。
table.row-select.dataTable tbody td
{
cursor: pointer;
}
And you html will look as below:
你的 html 将如下所示：
<table datatable="" dt-options="dtOptions1" dt-columns="dtColumns1" class="table table-striped table-bordered table-hover row-select" id="datatable"></table>
