css 选择样式并将其更改为特定th或td

ndasle7k 于 2024-01-09 发布在其他

关注(0)|答案(2)|浏览(153)

我是HTML和CSS的新手。我面临的问题是在特定的th或td行中更改字体。我将尝试在代码中解释。
如何使用CSS选择特定的表格单元格来改变样式，而不需要JavaScript，然后使用属性来放置样式。
代码：

<style>
    table, th, td {
      border: 3px solid white;
      border-collapse: collapse;
    }

    th, td {
      padding:10px;
    }
</style>
<body style="color:white;background-color:black">
<html>
    <table>
      <tr>
        <th>dummy</th>
        <th>dummy</th>
        <th>dummy</th>
        <th>dummy</th>
        <th>dummy</th>
        <th>dummy</th>
        <th>dummy</th>
        <th>dummy</th>
      </tr>
      <tr>
        <td>dummy</td>
        <td>dummy</td>
        <td>dummy</td>
        <td>dummy</td>
        <td>dummy</td>
        <td>dummy</td>
        <td>dummy</td>
        <td>dummy</td>
      </tr>
      <tr>
        <td>dummy</td>

<!--Part need to change style from this line--><td>dummy</td>

        <td>dummy</td>
        <td>dummy</td>
        <td>dummy</td>
        <td>dummy</td>
        <td>dummy</td>
        <td>dummy</td><!--to this line-->
      </tr>
    </table>

字符串
注解部分是选择特定的td，然后在最后一条注解处结束选择。
我已经使用了tbody标签，但它不起作用。Span和div标签也不起作用。
我怎么能改变的风格，从该部分或需要任何标签？

css

来源：https://stackoverflow.com/questions/77670090/select-and-change-style-to-a-specific-th-or-td

2条答案

按热度按时间

w9apscun1#

希望这能有所帮助。使用nth-child并学习如何将其用作选择器。

table,
th,
td {
  border: 3px solid white;
  border-collapse: collapse;
}

th,
td {
  padding: 10px;
}

body {
  color: white;
  background-color: black;
}

tr:nth-of-type(2) td:nth-of-type(2) {background:yellow; font-family: 'comic sans ms'}
tr:nth-of-type(2) td:nth-of-type(3) {background:pink; font-family: 'comic sans ms'}
tr:nth-of-type(2) td:nth-of-type(4) {background:blue; font-family: 'times new roman'}

个字符

赞(0）回复(0）举报 2024-01-09

pcrecxhr2#

您可以使用tr:last-child td:not(:first-child)选择器来定位最后一行中的表格单元格（第一个单元格除外）：

tr:last-child td:not(:first-child) {
  background-color: #ff07;
}

table,
th,
td {
  border: 3px solid white;
  border-collapse: collapse;
}

body {
  color: white;
  background-color: black;
}

个字符

赞(0）回复(0）举报 2024-01-09

我来回答

css 选择样式并将其更改为特定th或td

2条答案

相关问题

热门标签

最新问答