当行内的单元格具有类名称时,为什么 CSS 悬停在表格行上不起作用?

2024-04-11

我遇到了这个问题,所以任何帮助将不胜感激。我有一张有几行的桌子。行中的每个单元格都属于某个类别。我使用这些类名来给单元格着色。

这是我的表中的一个示例行:

<tr>
     <td class = "summarypage-odd-column">Theme</td>    <td class = "summarypage-odd-column">Q2 2009</td>   <td class = "summarypage-odd-column">Q1 2009</td>
     <td class = "summarypage-even-column">Theme</td>   <td class = "summarypage-even-column">Q2 2009</td>  <td class = "summarypage-even-column">Q1 2009</td>
     <td class = "summarypage-odd-column">Business Area</td>    <td class = "summarypage-odd-column">Q1 2009</td>   <td class = "summarypage-odd-column">Q1 2008</td>
 </tr>

当用户将鼠标指针移动到该行中的任何单元格上时,我想突出显示每一行。所以我使用下面的 CSS 代码来实现这一点。

tr:hover {
  background-color: #FFFAF0; color: #000;
}

不幸的是,似乎因为每个表数据单元格都有一个类名,所以悬停不起作用。但是,如果我从数据单元格中删除类名称,则悬停将起作用。

我的问题是有什么方法可以让悬停功能适用于表行,同时仍然具有行内表数据单元格的类名称。


尝试这个:

tr:hover td {
  background-color: #FFFAF0; color: #000;
}

将其放置在现有的之后td样式声明要安全

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

当行内的单元格具有类名称时,为什么 CSS 悬停在表格行上不起作用? 的相关文章

  • 居中

    我的问题 http i56 tinypic com ff3jmo png http i56 tinypic com ff3jmo png 项目符号点未对齐 我要做的只是 text align center ing ul 所在的类 我可以对齐
  • 深层嵌套 Flexbox 布局是否会导致性能问题?

    我一直在开发一个 ReactJS 项目 其中我使用 Flexbox 布局创建了大部分组件 由于使用 React 我们可以拥有深度嵌套的组件 因此我的布局具有嵌套的 Flexbox 布局 现在我的问题是 这对性能有任何问题吗 在一个页面上 有
  • 禁用 WebView 中 div 上的橙色突出显示

    我正在制作 PhoneGap Android 应用程序 无法关闭橙色突出显示可点击元素 我已经尝试了 CSS 的所有组合 webkit tap highlight color webkit focus ring color 和 webkit
  • 使用 CSS 在 javaFX 中设置按钮样式

    我在使用 CSS 的 javaFX 中设置按钮样式时遇到问题 我使用 Intellij Idea IDE 我有 CSS css 文件 Button fx padding 8 15 15 15 fx background insets 0 0
  • 最大宽度不适用于弹性项目

    我有一列中有一个弹性容器和两个弹性子容器 顶部 div 应填充所有剩余空间 底部 div 的高度应由内容和max width 但底部 div 的宽度正在缩小到其内容的宽度 这max width正在被忽视 hero image min hei
  • 集成引导模板的 ASP .Net MVC Web 应用程序

    我知道对于这个问题我可能会得到太多的反对票 但我只是找不到解决我的问题的教程 我在 Visual Studio 2013 中创建了一个 ASP Net MVC 项目 新项目 gt ASP NET Web 应用程序 gt MVC 我正在尝试更
  • HTML/CSS - 使用图像作为输入类型=文件

    如何使用此图像 http h899310 devhost se proxy newProxy uplfile png http h899310 devhost se proxy newProxy uplfile png 而不是常规的
  • youtube 将视频嵌入为带有边框半径的 iframe

    我遇到了一个我完全不明白的问题 我有一个带有 YouTube 视频 iframe 的网站 想通过 CSS 来圆化边框 在http www wunschpreisdeal de empfehlung winterreifen profilti
  • 检测计算机是否可以正确支持 3D 变换

    当我检测到 webkit 时 我使用 3D Transforms 属性添加额外的样式表 尽管它在许多不同的计算机上运行良好 全部使用相同的 chrome 版本 有些无法正确渲染动画 这些是较旧的计算机 具有更便宜的显卡 我猜这就是导致问题的
  • 如何使CSS图像溢出其所在的div

    我在 css 中输入了一个图像 代码如下 imgtemp float right top 0px left 0px overflow visible width 100 我还在页面中添加了 div 标签 以便其显示 但由于设计原因 图像比
  • React 嵌入脚本标签不可样式化

    我打算将 SurveyMonkey 调查嵌入到我的网站中 用 React 制作 只是让它工作起来很麻烦 但最终这段代码工作了 let script let extractScript
  • 不加载隐藏图像

    我的网站上有一堆隐藏图像 它们的容器 DIV 具有 style display none 根据用户的操作 某些图像可能会通过 JavaScript 显示 问题是我的所有图像都是在打开页面时加载的 我想通过仅加载最终可见的图像来减轻服务器的压
  • CSS - 设计类样式的不同方法

    阅读下面的 CSS 代码我想知道 a 和 b 之间有什么区别 第一个声明是一种好的样式方式吗 a round box icon b round box icon 使用 A 您选择具有 2 个类的所有元素 同时 使用 B 您选择所有具有类 r
  • 如何使 superfish 下拉菜单响应式?

    我正在使用带有骨架框架的 superfish 下拉菜单 我希望它也能在手机上运行 默认情况下 它显示下拉项目 但它将鼠标悬停在其下方的项目上 我想以某种方式拥有它 以便它将父项推到它下面 有什么解决办法吗 这是一个更好的答案 我能够将 Su
  • 如何根据子宽度设置 div 的宽度?

    我想使用 HTML 和 CSS 创建一个类似于 UI 的线程视图 聊天收件箱 http jsfiddle net 7mbaksvj http jsfiddle net 7mbaksvj 我的问题是 div 的宽度 它以固定宽度的形式出现 但
  • 使用 CSS 让图像位于文本后面并使其保持在中心位置

    我正在创建一个网页 其中有一个要放置在中心的图像 在该图像的顶部 我想要有输入框 标签和提交按钮 我正在尝试使用这个CSS img center z index 1 但这不起作用 当我将代码更改为 img center position a
  • 使用 javascript 将 CSS 类添加到具有另一个类名的所有元素

    我正在尝试使用 javascript 将类添加到具有不同类的所有元素 我知道你可能认为这是多余的 但对于我所处的情况来说这是必要的 我需要一种方法来查看具有该类名称的所有元素并添加该类 但我不明白如何获取计数 我正在使用一个 cms 但我无
  • http://jigsaw.w3.org/css-validator/ 和 http://www.css-validator.org/ CSS 验证器之间的区别?

    我尝试使用两个验证器验证我的 CSS 但它们给出了不同的结果 http www css validator org http www css validator org 返回的错误 在我的例子中为 245 比http jigsaw w3 o
  • 是否可以将选择框中的文本居中?

    我试过这个 http jsfiddle net ilyaD KGcC3 http jsfiddle net ilyaD KGcC3 HTML
  • 在 Safari for Lion (OS X 10.7) 中设置滚动条颜色

    Lion 中的新滚动条似乎会根据 body 元素的背景颜色调整 Safari 中的颜色 有没有办法手动设置滚动条是深色还是浅色 我知道有 webkit CSS 选项来设置滚动条的样式 这实际上早于新的 Lion 滚动条 我使用该方法的唯一问

随机推荐