将鼠标悬停在html表格中的单元格上时更改其颜色

我已经看了所有的答案张贴，但我似乎不能得到这个代码正常工作。当我将鼠标悬停在单个单元格上时，我试图使其改变颜色，但我无法使用我们正在使用的服务访问.css。我被迫删除一个HTML代码框，我可以将我的代码粘贴到特定于我正在更改的元素中，但不能粘贴整个.css文件…只有该元素

这是我的密码。当我翻过单元格时，如果您能帮助我将背景更改为#ff0000，并将文本更改为#000000，我们将不胜感激

（我最终的目的是为每个单元格添加a>a href，但我正试图一步一步地完成此操作。>a href将（我希望）将所选单元格添加到购物车中。）

身体{
背景：#000；
}
#包裹{
页边距：0自动；/*页边距0自动将使该框在文档中居中*/
宽度：780px；/*您的盒子大小*/
背景：#000；
文本对齐：居中；/*该框中的所有内容都将水平居中*/
}
每月消息
1个月定价
3个月定价
12个月定价
500
14.95美元/月
12.95美元/月
9.95美元/月
1,000
24.95美元/月
20.95美元/月
17.95美元/月
1,500
37.95美元/月
31.95美元/月
26.95美元/月
2,000
49.95美元/月
41.95美元/月
35.95美元/月
2,500
62.95美元/月
52.95美元/月
44.95美元/月
5,000
119.95美元/月
无法使用的
无法使用的
7,500
179.95美元/月
无法使用的
无法使用的
10,000
219.95美元/月
无法使用的
无法使用的
CSS:
td:hover，th:hover{background:#ff0000；color:#000；}
在CSS中：

td:hover {
  background-color: #ff0000;
  color: #000000;
}

也可以使用JavaScript/jQuery：

$(document).ready(function() {
  $("td").hover(
    function() {
      $(this).css('background-color', '#ff0000');
      $(this).css('color', '#000000');
    }, 
    function() {
      $(this).css('background-color', 'none');
      $(this).css('color', 'black'); // or whatever your original color was
    }
  );
});

使用div（class=“cell\u hvr”）和内容周围的链接包装单元格数据

.cell_hvr {
    padding: 2px;
    width: 100%;
    height: 100%;
}
.cell_hvr a {
    display: block;
    text-decoration: none;
}
.cell_hvr a:hover {
    background-color: red;
}

<div class="cell_hvr"><a href="#" target="_blank"> (Your content) </a></div>

.cell\u hvr{
填充：2px；
宽度：100%；
身高：100%；
}
.cell_hvr a{
显示：块；
文字装饰：无；
}
.cell_hvr a:悬停{
背景色：红色；
}
您可以通过给每个单元格一个类来实现这一点

<td class="a">..</td>

。。

然后设计它的样式

<style>
  td.a { background-color:#ff0000; }
  td.a:hover { background-color:#000000; }
</style>


td.a{背景色：#ff0000；}
td.a:悬停{背景色：#000000；}
我正在寻找这个问题答案的JavaScript版本。但是，我没有使用JQuery

我有
oCell=newRow.insertCell（）；
oCell.style.background=tintest（myCounts[i]）

myCounts只是一个包含Int的数组

但现在我只想在我当前的oCell中添加悬停背景色，然后将其粉碎并继续循环。。。。。。
因此，我发现下面的代码是“无法完成”流中唯一的检查答案。。只是不确定这是否对我有帮助

var css = 'table td:hover{ background-color: #00ff00 }';
var style = document.createElement('style');

if (style.styleSheet) {
    style.styleSheet.cssText = css;
} else {
    style.appendChild(document.createTextNode(css));
}

document.getElementsByTagName('head')[0].appendChild(style);

编辑！！！我刚刚发现我的问题（我希望代码剪贴仍然对你有帮助），我尝试在CSS中添加hover，但它根本不受支持。
td:hover{background color:#ff0000；color:#000000；}做了我希望它对我的表头所做的事情……但是表中的单个单元格呢？
td:hover{background color:#ff0000；color:#000000；}
应该在单元格上工作。当您将鼠标悬停在标题上时，是否也希望标题发生一些事情？您所说的“我被迫删除一个HTML代码框，可以将代码粘贴到特定于我正在更改的元素中”是什么意思？你的意思是你只能为一个HTML元素创建一个
style
属性吗？向我们展示一个例子，说明你能做些什么，得到HTML和CSS代码。
var css = 'table td:hover{ background-color: #00ff00 }';
var style = document.createElement('style');

if (style.styleSheet) {
    style.styleSheet.cssText = css;
} else {
    style.appendChild(document.createTextNode(css));
}

document.getElementsByTagName('head')[0].appendChild(style);