请解释rowspan和colspan,col和colgroup

Jit*_*yas 11 css xhtml semantic-markup

任何人都可以解释rowspancolspan,colcolgroup?这些W3C的有效性和语义是否正确?在哪些情况下这些有用?

oez*_*ezi 15

合并单元格

<table border="1">
  <tr>
    <th colspan="2">people are...</th>
  </tr>
  <tr>
    <td>monkeys</td>
    <td>donkeys</td>
  </tr>
</table>
Run Code Online (Sandbox Code Playgroud)

行跨度

<table border="1">
  <tr>
    <th rowspan="2">monkeys are...</th>
    <td>... real monkeys</td>
  </tr>
  <tr>
    <td>... 'unreal' monkeys (people...)</td>
  </tr>
</table>
Run Code Online (Sandbox Code Playgroud)

W3C

如你所见,这是用于连接表格单元格 - 因为这有时是必要的,它是有效的(RegDwights链接将提供更多信息......).

COL/COLGROUP

colgroupcol用于将属性设置为表中的每一行(因此您不必width="80"td每行(tr)中的第一行写入):

<table border="1">
  <colgroup>
    <col width="80">
    <col width="100">
    <col width="320">
  </colgroup>
  <tr>
    <td>first line, first column</td>
    <td>first line, second column</td>
    <td>first line, third column</td>
  </tr>
  <!-- more table-lines... -->
</table>
Run Code Online (Sandbox Code Playgroud)

你也可以对cols进行分组,假设第一列和第二列应该得到with80,第三列得到320:

<table border="1">
  <colgroup width="80" span="2"></colgroup>
  <colgroup width="320" span="1"></colgroup>
  <tr>
    <td>first line, first column</td>
    <td>first line, second column</td>
    <td>first line, third column</td>
  </tr>
  <!-- more table-lines... -->
</table>
Run Code Online (Sandbox Code Playgroud)


Яeg*_*ght 5

是的,它们都是W3C推荐的.以下是文档的直接链接: