CSS样式不适用于表格

Question

我有一个表似乎没有采用某些样式，无论它们是在外部样式表中还是在嵌入式样式中。

我在head标签内添加了一个脚本，然后将选择器h4设置为仍在head标签内。

这些不适用于实际表中的h4部分，我不确定自己在做什么错。

我还在外部样式表中有一个主选择器，该主选择器应该在表格外部添加背景色，但它没有这样做。 但它也不适用于表格。

Answer 1

您的h4无法设置样式的问题是因为

<h4><th>hello world</th></h4>

h4 { color: red; }

<h1>Table 1</h1>
<table>
  <tr>
    <h4><th>Firstname</th></h4>
    <h4><th>Lastname</th></h4>
    <h4><th>Age</th></h4>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
  </tr>
</table>

h4应该在表格标题内

<th><h4>hello world</h4></th>

h4 { color: red; }

<h1>Table 2</h1>
<table>
  <tr>
    <th><h4>Firstname</h4></th>
    <th><h4>Lastname</h4></th> 
    <th><h4>Age</h4></th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
  </tr>
</table>

Answer 2

将h4标签放入td标签

您的代码：

<h4><td>The Fantastic Four</td><h4>
...
<h4><td>The Avengers</td><h4>
...
<h4><td>Justice League</td><h4>
...

尝试：

<td><h4>The Fantastic Four</h4><td>
...
<td><h4>The Avengers</h4><td>
...
<td><h4>Justice League</h4><td4>
...