Fatal编程技术网
  • html/
  • 使用rowspan的HTML表头

使用rowspan的HTML表头

html

使用rowspan的HTML表头,html,html-table,Html,Html Table,预期产量 A test table with merged cells /-----------------------------------------\ | | Average | Red | | |-------------------| eyes | | | height | weight | | |-----------------------------------

预期产量

  A test table with merged cells
/-----------------------------------------\
|          |      Average      |   Red    |
|          |-------------------|  eyes    |
|          |  height |  weight |          |
|-----------------------------------------|
|  1.9     | 0.003   |   40%    |         |
|-----------------------------------------|
|  1.7     | 0.002   |   43%    |         |
\-----------------------------------------/
删除代码中额外的TH


具有合并单元格的测试表
平均值
红色的眼睛
高度
1.90.00340%
1.70.00243%
更改第一行

<html>
<body>

<TABLE border="1" >

<CAPTION><EM>A test table with merged cells</EM></CAPTION>

<TR>
    <TH colspan="2"> Average</TH>
    <TH rowspan="2">Red<BR>eyes </TH>
</TR>
<TR>
  <TH>height</TH><TH>weight</TH>
</TR>
<TR> 
  <TD>1.9<TD>0.003<TD>40%</TD>
</TR>
<TR> 
  <TD>1.7<TD>0.002<TD>43%</TD>
</TR>

</TABLE>
</body>
</html>


平均值
红色的眼睛
它将解决问题

虽然已经解决了您的问题，但我只想就您的HTML结构提出一些建议

首先，大写字母不是强制性的（HTML不区分大小写），但是您是否应该切换到XHTML小写字母是强制性的（坦率地说，它看起来也更好一些）

其次，由于
tbody
元素总是由浏览器插入（我不确定是否所有客户端，但肯定是可视化web客户端），如果还没有一个存在，通常最好将那些表示表的“主体”的元素封装在
tbody
中，通过这种方式，您可以将
th
元素行分配给
thead
，这会稍微增加语义（我不确定这有多有用，但每一点都有帮助）

第三，记住关闭标签：

<TR>
    <TH colspan="2"> Average</TH>
    <TH rowspan="2">Red<BR>eyes </TH>
</TR>
CSS:

.

你的问题是。。？ 
<html>
<body>

<TABLE border="1" >

<CAPTION><EM>A test table with merged cells</EM></CAPTION>

<TR>
    <TH colspan="2"> Average</TH>
    <TH rowspan="2">Red<BR>eyes </TH>
</TR>
<TR>
  <TH>height</TH><TH>weight</TH>
</TR>
<TR> 
  <TD>1.9<TD>0.003<TD>40%</TD>
</TR>
<TR> 
  <TD>1.7<TD>0.002<TD>43%</TD>
</TR>

</TABLE>
</body>
</html>

<TR>
    <TH colspan="2"> Average</TH>
    <TH rowspan="2">Red<BR>eyes </TH>
</TR>

<TR> 
  <TD>1.9<TD>0.003<TD>40%</TD>
</TR>

<TR> 
  <TD>1.9</TD><TD>0.003</TD><TD>40%</TD>
</TR>

<table>
    <caption>A test table with merged cells</caption>
    <theader>
        <tr>
            <th colspan="2">Average</th>
            <th rowspan="2">Red Eyes</th>
        </tr>
        <tr>
            <th>height</th>
            <th>weight</th>
        </tr>
    </theader>
    <tbody>
        <tr>
            <td>1.9</td>
            <td>0.003</td>
            <td>40%</td>
        </tr>
        <tr>
            <td>1.7</td>
            <td>0.002</td>
            <td>43%</td>
        </tr>
    </tbody>
</table>​

caption {
    font-style: italic;
}

td,
th {
    border: 1px solid #000;
    padding: 0.2em;
}​