第 n 个范围的 CSS 选择器?

2023-12-08

如何调整下面的 CSS 选择器:

.myTableRow td:nth-child(?){
  background-color: #FFFFCC;
}

所以它适用于td2~4?

<table>
  <tr class="myTableRow">
    <td>column 1</td>
    <td>column 2</td>
    <td>column 3</td>
    <td>column 4</td>
    <td>column 5</td>
  </tr>
</table>

您可以使用的另一种方法是:

.myTableRow td:nth-child(n+2):nth-child(-n+4){
    background-color: #FFFFCC;
}

这更清楚一点,因为它包括您范围内的数字(2 and 4) 而不必从末尾倒数。

它也更加稳健,因为您不必考虑项目的总数。

为了澄清:

:nth-child(n+X)     /* all children from the Xth position onward */
:nth-child(-n+x)    /* all children up to the Xth position       */

Example:

#nn div {
    width: 40px;
    height: 40px;
    background-color: black;
    display: inline-block;
    margin-right: 10px;
}

#nn div:nth-child(n+3):nth-child(-n+6) {
    background-color: blue;
}
<div id="nn">
    <div></div>    
    <div></div>    
    <div></div>    
    <div></div>    
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

第 n 个范围的 CSS 选择器? 的相关文章

  • jQuery animate() 和 CSS calc()

    我尝试设置CSScalc 使用 jQuery 动画 例如 element animate height calc 100 30px 500 我注意到calc 不支持 jQuery 动画 我希望有一种方法可以做到这一点 我不想要类似的方法 替
  • 当鼠标悬停在链接上时,如何在链接旁边创建弹出框?

    这是我想要实现的 我的网页上显示了两个超链接 a href http foo com foo a a href http bar com bar a 我还有两个对 div 链接的描述 div foo means foo div div ba
  • stripe checkout css内容策略错误

    我正在尝试创建一种形式条纹结账 https stripe com docs checkout在我的 Ionic 应用程序中 我创建了一个指令 将表单植入到我的内容视图中 但是当我运行它时 CSS 因违反内容策略而失败 checkout js
  • 您能否确定 CSS 文件的范围,使其仅适用于给定元素的后代?

    给定一个 css 文件 有没有办法限制整个文件的范围 使其仅适用于给定元素内的元素 例如给定 div span class some element span div 有没有一种方法可以将整个 css 文件的范围应用于 容器 中的所有元素
  • 如何观察包含许多 sass 文件的整个目录/文件夹的变化

    我如何跟踪包含许多 sass 文件的整个目录的更改 我正在使用以下命令来观察 sass 的变化 file sass watch style scss style css 但是如何观察包含许多 sass 文件的整个目录 文件夹的变化 只需使用
  • 有 CSS 父选择器吗?

    我该如何选择 li 元素是锚元素的直接父元素 举个例子 我的 CSS 应该是这样的 li lt a active property value 显然 有多种方法可以使用 JavaScript 实现此目的 但我希望 CSS Level 2 本
  • 使用 bootstrap 将搜索图标放入文本框中

    我默认使用引导程序 文本框占据列的全宽 我想将搜索图标放在文本框的末尾 我的代码是这样的 div class container div class row div class form group col lg 4 div div div
  • CSS - SASS:使用基于@each的mixins来生成多个背景

    我正在使用 CSS 创建发型和颜色目录 我有 55 种不同颜色和发型的组合 每种发型和颜色都有自己的图像 SVG 文件 我需要将它们全部组合成一个背景 使用 CSS3 的多背景功能 我编写了这个混合来生成多个背景 它基于 mixin在这篇文
  • 使用本机 JavaScript 获取过渡中的 CSS 值

    这个问题之前被问过 但答案使用了 jQuery here https stackoverflow com q 8920934 3186555 因此 我将调整问题以专门询问native解决方案 to 最小化依赖关系 假设您有一个 div 然后
  • 删除

    好的 我有一个小菜单栏 菜单内的三个元素还有更多的子菜单 但是菜单栏中的元素之间有不必要的间距 而且我创建的子菜单有不必要的背景宽度 我在代码中将其涂成白色以使读者理解 由于这种不必要的宽度 即使鼠标悬停在不可见的宽度上 在本例中为白色 本
  • 如何修复“没有这样的文件或目录,lstat 'scss/'”?

    我正在尝试遵循 youtube 上的简单教程他尝试使用终端运行 npm 脚本 sass 文件 当我执行命令时npm 运行 sass显示错误消息错误 ENOENT 没有这样的文件或目录 lstat scss 我认为问题在于文件的路径或文件的权
  • 如何保留用户的输入打印?

    我正在尝试添加用户的评论 所以我只是尝试读取输入并将其发送以进行打印 但问题是 一旦我刷新页面或输入另一个输入 打印的输入就会消失 因此 即使刷新页面或重新输入新评论 我也希望始终保持所有用户的显示 代码 div div
  • 单击导航项锚链接时如何关闭切换菜单

    请看我的FIDDLE http jsfiddle net ayhpp8ax 我有一个带有 响应式 导航菜单 带有指向页面上元素的锚链接 的 1 页网站 当浏览器视口小于特定宽度 在我的情况下为 767px 时 使用此 javascript
  • html 电子邮件内的背景图像 css - Gmail 不支持

    我想向我的用户发送如下所示的带有背景图像 css 的 html 正文电子邮件 div style width 500px height 1000px background color black background image none
  • div 中的中心文本?

    我有一个div 30px高和500px宽的 这div可以包含两行文本 一行在一行 并相应地设置样式 填充 但有时它只包含一行 我希望它居中 这可能吗 要水平居中 请使用text align center 要垂直居中 只能使用vertical
  • Sass:@use 出错,未定义变量

    我正在使用 Sass 并且想要使用 use关键字而不是 import 因为 import有很多问题 另外只有dart sass支持这个功能 我将node sass改为dart sass 然而 问题出现了 我原来的代码 import carb
  • 浮动图像周围具有最小列宽的流动文本

    我想要一种方法来防止流动文本列变得太窄 例如 在一列 HTML 文本中 有一个图像浮动到左侧 正如预期的那样 文本沿着图像周围的列的右侧向下流动 但是 如果图像几乎与列一样宽 则文本最终会非常窄 在这种情况下 我希望文本简单地not流过图像
  • 导航栏下拉菜单(折叠)在 Bootstrap 5 中不起作用

    我在尝试使用以下命令创建响应式菜单或下拉按钮时遇到问题Bootstrap 5一切似乎都正常 导航图标和下拉图标出现 但它不起作用 当我单击nav图标或dropdown按钮 无dropdown menu apears 我想特别提到的是 我还包
  • 如何在模态打开时防止主体滚动

    我在用着W3schools 模态脚本 https www w3schools com howto tryit asp filename tryhow css modal我想添加一个功能 防止模型打开时整个主体滚动 我根据我的需要对原始脚本做
  • 使用 JavaScript 移动页面上的按钮

    我的按钮可以移动 但奇怪的是 我无法弄清楚偏移是否有问题 我希望我的按钮随着鼠标光标移动 但现在它的移动方式不是我想要的 有时它会消失 另外 创建的新按钮是重叠的 我不知道如何解决这个问题并拥有更好的外观 var coorA var coo

随机推荐

  • 在 grails 的 jasper 报告中以 pdf 格式显示新安装的字体

    我正在使用 iReport 4 5 0 和 grails 2 1 1 我想对 pdf 格式的报告中的某些文本使用 Canterbury 字体 因此我使用 iReport 设计器将该字体分配给我想要的文本 我还进入 iReport 设计器的工
  • 熟悉 MVC - 如何使用会话逻辑、附加类和后台逻辑

    在编写 PHP 代码时 我决定放弃意大利面条式代码并尝试实现 MVC 为了实现MVC框架 我发泄本文文章给了我一个良好的开端 我成功地创建了我的网站并开发了前端 现在 我正在尝试使用会话和其他会员区功能来实现后端 我的大脑充满了新信息 我的
  • 查找两个字符串数组之间的非公共元素

    有一个问题是如何找到两个字符串数组之间的非公共元素 例如 String a a b c d String b b c O p should be a d 我已经尝试过以下方法 但请告知是否有其他有效的方法来实现相同的目标 String a
  • TLabel 和 TGroupbox 标题在调整大小时闪烁

    所以 我有一个应用程序加载不同的插件并创建一个 每个 TPageControl 上都有一个新选项卡 每个 DLL 都有一个与其关联的 TForm 创建表单时将其父级 hWnd 作为新的 TTabSheet 由于就 VCL 而言 TTabSh
  • WebResource.axd 不适用于 Internet Explorer 11

    我们正在针对新的 Windows 8 1 IE 11 浏览器 classic 和 Metro 测试我们的网站 有一个Javascript文件嵌入WebResource axd The WebResource可以在 Firefox Googl
  • 将 H2 数据传输到 PostgreSQL

    我正在从 H2 数据库过渡到 PostgreSQL 据我发现 在 H2 上执行 SCRIPT TO 命令时创建的 SQL 转储包含几个不适当的结构 Unicode 数据用函数 STRINGDECODE unicode data 包装 二进制
  • 将OutputStream发送到浏览器并让浏览器保存它[重复]

    这个问题在这里已经有答案了 我想从 Rich Faces 数据表导出数据 我已经从数据表中的数据创建了outputStream 现在想将这个OutputStream发送到浏览器并让它保存 我怎样才能做到这一点 FileOutputStrea
  • 无法在无 cookie Web 应用程序上创建 asp.net 会话

    我有一个无cookie的基于asp net 4 5的网络应用程序
  • HTML5 localStorage 不适用于 Android WebView

    我正在使用 Buzztouch 为客户端制作移动应用程序 因此 html 页面不在应用程序内 它们是通过 JSON 从服务器加载的 客户希望应用程序上有一个屏幕 用户可以在其中将详细信息输入时间表并将其存储在手机上 我尝试使用 localS
  • 如何计算Android应用程序中两点之间的距离

    在我的应用程序中 我试图计算一个人从一个地方到另一个地方的旅行距离 为此 我使用半正矢公式 R earth s radius mean radius 6 371km lat lat2 lat1 long long2 long1 a sin
  • 为什么线程不停止?

    我的服务生成一个新线程 并根据通常推荐java中断 的方法 当我停止服务时 我会在 onDestroy 中停止线程 服务停止 到达中断代码 然而 很快线程就会从 Runnable 的开头重新启动 public class DoScan ex
  • 使用欧氏距离在 numpy 数组列表中查找 numpy 数组的最近邻居

    我有一个 n 维向量 我想使用欧几里得距离在 n 维向量列表中找到它的 k 个最近邻 我编写了以下代码 k 10 它可以工作 但运行速度太慢 我想知道是否有更优化的解决方案 def nearest neighbors value array
  • MVVM 将 RelayCommand CanExecute 绑定到属性?

    我有一个计时器和三个按钮来控制它 开始 停止和暂停 每个按钮都绑定到一个 RelayCommand 我有一个 TimerState 类型的属性enum TimerState 这对于设置各种 GUI 元素很有用 有没有办法以某种方式将 Rel
  • 根据空格或“双引号字符串”将字符串解析为数组

    我试图获取用户输入字符串并解析为一个名为 char entire line 100 的数组 其中每个单词都放在数组的不同索引处 但如果字符串的一部分用引号封装 则应将其放在单个索引中 所以如果我有 char buffer 1024 0 fg
  • 无法获取托管类型的地址、获取其大小或声明指向托管类型(“类型名称”)的指针

    如果我的结构中有一个或多个 System String 此错误将停止编译还有其他方式存储字符串吗 我尝试过这样的事情 private long B ID private byte C Name private byte C Address
  • 互斥体未释放

    我的 c WinForm 解决方案包含多个项目 其中包括包含 frmAdmin 的管理项目和包含 frmUser 的用户项目 第三个项目包含 frmTimer 它有一个定期启动 frmUser 的计时器 我希望 frmTimer 在 frm
  • 仅使用生产证书时无法注册推送通知

    使用开发证书时 推送通知工作正常 当我在临时发行版中切换到生产证书时 应用程序无法注册推送通知 在 UIApplicationDelegate 中 两者都没有didRegisterForRemoteNotificationsWithDevi
  • Java Swing,尝试用图像图标复选框替换 JTable 中的布尔复选框

    所以我有一个带有复选框的 JTable 我希望复选框在 选中 时包含一个图像 在 未选中 时包含另一图像 即显示图像而不是选中或未选中的框 有没有办法做到这一点 我尝试过使用 TableCellRenderer 返回带有 ImageIcon
  • 自反传递闭包的定义

    许多谓词本质上使用某种形式的传递闭包 只是发现终止也必须得到解决 为什么不一劳永逸地解决这个问题closure0 3 meta predicate closure0 2 meta predicate closure 2 meta predi
  • 第 n 个范围的 CSS 选择器?

    如何调整下面的 CSS 选择器 myTableRow td nth child background color FFFFCC 所以它适用于td列2 4 table tr class myTableRow td column 1 td td