仅在一列中交替行 - CSS

2023-12-01

如何仅在表格的一列中为交替行着色?代码是什么?


正如 @afranz409 所说,理想的解决方案是创建一个类。然而,这可以通过 CSS 特定解决方案来完成,浏览器功能有限(没有 IE 浏览器

table tr:nth-child(2n) > td:nth-child(1) {
    background-color: #eee;
}

换句话说,对于每个替代行,在第一个表列中填充背景颜色#eee。如上所见JsFiddle.

对于跨浏览器兼容的解决方案,我建议在 jQuery 中使用此选择器:

$('table tr:nth-child(2n) > td:nth-child(1)').css("background-color", "#eee");

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

仅在一列中交替行 - CSS 的相关文章

  • 在文本基线上水平对齐块

    我有以下 HTML 代码
  • 检测所有现代浏览器上的缩放级别

    我想知道是否有一种方法可以检测所有现代浏览器都支持的页面缩放级别 我已经尝试过这个 如何在所有现代浏览器中检测页面缩放级别 https stackoverflow com questions 1713771 how to detect pa
  • 将 div 元素放置在响应式背景上(Bootstrap 3)

    我想将 div 输入表单 放置在响应式背景上 我使用 Bootstrap 3 作为页面模板 但是 如果我调整窗口大小或使用其他屏幕尺寸 则元素位于另一个位置 我该如何解决这个常见问题 Example http goo gl D7TwIP h
  • 使用小屏幕时强制在按钮文本内换行

    我有一个响应式网络应用程序 其中包含一些对于小移动屏幕来说太大的按钮 它们包含太多文字 因此最终会从屏幕上消失 我目前正在使用a通过给它们引导类来标记为按钮 所以目前的代码是这样的 a Here I have a button with l
  • chrome 不渲染 gif 背景图像

    当前运行 chrome 14 它无法在我的登录页面上呈现旋转的 gif 图形 这是该页面在 Chrome 中的样子 这是它在所有其他浏览器上的样子 重现 http trunk test openmile com login null htt
  • 如何在浏览器调整大小时刷新屏幕?

    是否可以根据浏览器尺寸的变化刷新页面 我使用一些样式在页面上创建区域 如果浏览器缩小 布局就会中断 也许我可以用 jQuery 检测文档大小的变化 为现在查看此内容的任何人进行更新 JQuery 现在认为绑定是一个已弃用的函数 Proxim
  • 设置 display:block 后将焦点设置在输入元素上

    我有一个 HTML 内容如下 div class hiddenClass this implies display none span span div
  • 我可以通过 Javascript 获取非标准 CSS 属性的值吗?

    我正在尝试读取自定义 非标准 CSS 属性 在样式表 不是内联样式属性 中设置并获取其值 以此 CSS 为例 someElement foo bar 我已经设法通过 IE7 中的 currentStyle 属性获取它的值 var eleme
  • 使全宽图像以 div 为中心

    我有一个最大高度为 400 像素的 div 容器 我在容器内放置了一个相当大的图像 由于容器具有最大高度 因此显然会切断大部分图片 这就是我的目标 但我唯一的问题是试图让图像在 div 内居中 以便显示图片的主要部分 这是我目前拥有的代码
  • 使用 JavaScript 跨浏览器的 Webkit 背景过滤器

    我看过这个令人惊叹的新演示 webkit backdrop filter blur Xpx 我想问如何用 JavaScript 重现这个至少在 Chrome 中工作但也可能在 Firefox 中工作的情况 演示 https webkit o
  • 如何独立于“thead”滚动表“tbody”?

    如指定W3规格 http www w3 org TR html401 struct tables html idx row group对于表 表格行可以分为桌头 桌脚和一个或多个 更多表体部分 使用THEAD https www w3 or
  • 自定义字体在 IE 中仍然不起作用

    我试图显示自定义字体 Duke Fill 的网页是http www hamlinforcongress com helpout php http www hamlinforcongress com helpout php 我在用着 font
  • Jquery 在页面加载时滚动到偏移目标 div

    我正在尝试滚动到 URL 中的 div 它可能是 21 个 ID 之一 例如 url com test lite1 url com test lite2 url com test lite3 我需要在页面加载时发生这种情况 用户来自电子书
  • 无法删除文档底部的空白

    我似乎每次渲染页面时都会生成这个空间块 我不知道它是如何出现在那里的 下面是我在 chrome 中检查时的图像 它发生在其他浏览器中 这是一个问题 因为它位于我的页脚下方 所以我只有空格 似乎没有 CSS 可以解决它 只能直接删除空格 这很
  • 在弹性行中使用“nowrap”时,避免将最后一个元素推离屏幕

    我需要在一行内渲染很长的文本 以及该行末端 屏幕的近端 的图像 给定一个很长的文本 我必须简单地截断它 该文本现在应该进入第二行 因为它太长了 请看我的代码 如何避免将漂亮的表情符号挤出屏幕 请考虑到右侧的元素可能是动态的 所以给出固定宽度
  • 隐藏加载失败的图片

    我有一个 Android 应用程序 它生成一些在本地 Webkit 视图中呈现的 HTML HTML 生成的细节实际上并不那么重要 除了 大部分来自一个地方 我无法改变它 HTML 周围的模板 包括页眉 页脚 HEAD 等 CSS 和 Ja
  • 如何选择与绝对定位 DIV 重叠的选项?

    我有一个绝对定位的 div 它的作用类似于工具提示 当鼠标悬停在某个元素上时 它会显示 然后在鼠标移开时隐藏 我有几个
  • 来自外部的 Shadow DOM CSS 样式在 Google Chrome 中不起作用

    我在用polymer s paper action dialog and paper button在我的网页中 纸张操作对话框中有两个纸张按钮 我想从外部 主 html 设计这些纸质按钮的样式 我已经写了CSS样式在shadow DOM符号
  • 竖线 (|) 是有效的 CSS 还是 Firefox 特定的?

    我注意到 Firebug 中的这条规则 link color 0000EE 我不确定我是否见过竖线 前 它位于 about PreferenceStyleSheet 中 因此它可能是 Firefox 特定的 这是什么意思 有参考链接吗 我以
  • 删除多个类 (jQuery)

    有没有更好的方法来重写这个 element removeClass class1 removeClass class2 我无法使用removeClass 因为它会删除我不想要的所有课程 element removeClass class1

随机推荐

  • 如果服务器返回错误状态,java.net.HttpUrlConnection是否总是抛出IOException?

    我在用java net HttpUrlConnection向我的服务器发出 Http 请求 我意识到如果服务器返回错误状态 例如 400 HttpUrlConnection 将抛出与错误状态相对应的 IOException 我的问题是 如果
  • 使用 Rails 4.1 中的 Searchkick gem 在 Elasticsearch 中设置 Facet

    我希望用户能够轻松找到一个系列 因此想要设置方面 我已按照以下指示进行操作西奇克一切都工作正常 但是当我设置 Facets 时 我得到以下回报 我希望它像他们的文档中那样 希望有人能帮忙 我在 myapp com movies 中找到了这个
  • 父状态更改后,React 子组件未更新

    我正在尝试制作一个漂亮的 ApiWrapper 组件来填充各种子组件中的数据 从我读过的所有内容来看 这应该有效 https jsfiddle net vinniejames m1mesp6z 1 class ApiWrapper exte
  • MySQL无法识别韩文字符

    我需要将韩文文本插入到我的数据库中 该数据库是通过 url get 请求来的 但是 MySQL 无法识别插入的值 请 需要快速指导 谢谢 setlocale LC CTYPE ko KR utf8 mb internal encoding
  • 即使在调用notifyDataSetCanged()之后,列表视图也会出现java.lang.IllegalStateException;

    java lang IllegalStateException 适配器的内容已更改 但 ListView 未收到通知 确保适配器的内容不是从后台线程修改的 而是仅从 UI 线程修改的 我的列表视图包含大量数据 当列表中的数据发生更改时 我使
  • 您可以在命令中访问 SBT 设置密钥吗?

    我正在编写一个命令并想使用Logger in TaskStreams但这是不可能的 因为您无法访问 value命令中的SettingKey 有什么办法吗 def myCommand Command single myCommand case
  • 在 Laravel 中过滤日期之间的数据以及多个搜索查询

    我想过滤日期之间的数据 我有很多来自前端的专栏 Screenshot of front end columns 除非日期过滤器出现 否则我有以下代码可以正常工作 我如何在此代码中添加日期过滤器并且它将起作用 我在下面提供了刀片文件代码和控制
  • 让数组像圆一样工作

    我不太确定该怎么做 伪代码 array1 a b c d e f g h i j there might be more values take c loop gt c 3 f f 3 i i 3 b b 3 e end loop 我需要做
  • LINQ where 子句在第二个 where 时抛出错误

    UPDATE 即使对联系人的名字或姓氏进行搜索也会导致问题 var contacts from c in context ContactSet join m in context py3 membershipSet on c Contact
  • 如何在 Python 中定义具有默认参数值和可选参数的函数?

    我想定义一个可以省略输入参数或具有默认值的函数 我有这个功能 def nearxy x y x0 y0 z distance for i in range 0 len x distance append abs math sqrt x i
  • 如何阻止 div 内并排的 3 个图像换行到下一行?

    我无法弄清楚这一点 我希望 3 个图像并排放置在 930px 宽的 div 中 因此 当您进入响应式设计模式 或横向拖动屏幕浏览器以使其变小时 所有 3 个图像将并排保留在 div 内 而不会换行到下一行 但会自动开始调整大小以适应调整大小
  • 如何阻止 MySQL 复制返回数组中每列的条目?

    我的 MySQL 查询返回包含重复条目的数组 编号键和标记键 其中包含相同的数据 这可能是标准的 但似乎很浪费 并且如果我打印值可能会导致问题 我的意思是 显然这不是一个大问题 但我只是好奇我是否能阻止它 看来没有必要 例如 Array 0
  • Unix fork() 系统调用什么时候运行?

    void child int pid printf Child PID d n pid exit 0 void parent int pid printf Parent PID d n pid exit 0 void init printf
  • 从不同字节中提取并组合位 c c++

    我已经声明了一个字节数组 uint8 t memory 123 我已经填写了 memory 0 0xFF memory 1 0x00 memory 2 0xFF memory 3 0x00 memory 4 0xFF 现在我收到用户对特定位
  • HttpRequest 和 POST

    我不断收到以下错误消息之一 The remote server returned an error 400 Bad Request OR System Net ProtocolViolationException You must writ
  • 如何在启动时启动应用程序[关闭]

    Closed 这个问题不符合堆栈溢出指南 目前不接受答案 这个问题似乎不是关于主要由程序员使用的特定编程问题 软件算法或软件工具 如果您认为该问题与主题相关另一个 Stack Exchange 站点 您可以发表评论来解释问题可以在哪里得到解
  • 为了副作用而导入 ES6 模块的可接受做法?

    我喜欢保持代码模块化 因此我将此类代码放在单独的文件中 overrides extra js import Ember from ember Ember RSVP configure onerror function error expor
  • 在 Node 中仅获取 GET 请求的标头

    我需要得到Content Length and Content Type的标题large带有 Node js 的文件 不幸的是 我正在处理的服务器不允许HEAD请求 并且文件太大 无法生成完整的GET要求 我正在寻找类似这样的 python
  • 视觉工作室更新 2013 1,2,3,4,5

    只是想问一下 Visual Studio 2013 的更新 4 是否还包括更新 1 2 3 4 因为它是侧面唯一可用的东西 所以我无法下载 1 2 3 的更新 而且大小确实很大 包含大约 5 GB 的数据 是的 更新是累积的 安装 Upda
  • 仅在一列中交替行 - CSS

    如何仅在表格的一列中为交替行着色 代码是什么 正如 afranz409 所说 理想的解决方案是创建一个类 然而 这可以通过 CSS 特定解决方案来完成 浏览器功能有限 没有 IE 浏览器 table tr nth child 2n gt t