Question

我有一个表，并希望在其中包含一个div，以便div包含一些表行。但它不起作用。

<table>
<tr><td> one</td></tr>

<div style="color: yellow;">
<tr><td> two</td></tr>
<tr><td> three</td></tr>
</div>

<tr><td> four </td></tr>
</table>

是否可以在div中包含表行？

非常感谢您提出的任何建议。

Answer 1

不，这是不可能的。

您可以在表格中放置任何内容的唯一位置是在单元格内。

也许你想要表格中的页眉和页脚？请注意，页脚位于正文之前：

<table>
  <thead>
    <tr><td> one</td></tr>
  </thead>
  <tfoot>
    <tr><td> four </td></tr>
  </tfoot>
  <tbody style="color: yellow;">
    <tr><td> two</td></tr>
    <tr><td> three</td></tr>
  </tbody>
</table>

Answer 2

使用<tbody>标记将行分组在一起：

<table>
    <tr><td> one</td></tr>
    <tbody style="color: yellow;">
        <tr><td> two</td></tr>
        <tr><td> three</td></tr>
    </tbody>
    <tbody style="color: red;">
        <tr><td> four </td></tr>
    </tbody>
</table>

Test case

Answer 3

那将是无效的HTML ..所以不可能。

你可以改为在你想要的行中添加一个类，并使用css来设置它的样式。

<table>
<tr><td> one</td></tr>
<tr class="colored"><td> two</td></tr>
<tr class="colored"><td> three</td></tr>
<tr><td> four </td></tr>
</table>

和css

.colored td{ color: yellow; }

如其他答案中所述，您可以使用<tbody> tag ^{w3c docs}进行分组，这样可以在表格中使用多个实例

<table>
    <tr><td> one</td></tr>
    <tbody class="colored">
        <tr><td> two</td></tr>
        <tr><td> three</td></tr>
    </tbody>
    <tr><td> four </td></tr>
    <tbody class="colored">
        <tr><td> five</td></tr>
        <tr><td> six</td></tr>
    </tbody>
</table>

演示 http://jsfiddle.net/gaby/n2yWe/

Answer 4

有可能（你刚刚做到了）但强烈不推荐，因为根据w3c规范你不能在div下嵌套table。浏览器可能会采取不同的行为，因为这里不需要定义行为。

html - 在div中包含td

4 个答案: