S'il vous plaît expliquer rowspan et colspan, col et colgroup

Question

Quelqu'un peut-il expliquer rowspan et colspan, col et colgroup? Et sont ces normes W3C et sémantiquement correct? Dans quelles circonstances ces documents utiles?

Answer 1

colspan

<table border="1">
  <tr>
    <th colspan="2">people are...</th>
  </tr>
  <tr>
    <td>monkeys</td>
    <td>donkeys</td>
  </tr>
</table>

rowspan

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

w3c

comme vous le voyez, cela est pour connecter les cellules de table--. Et parce que cela est parfois neccessary, il est valide (liens RegDwights donneront plus d'informations ...)

col / colgroup

colgroup et col sont utilisés pour définir les attributs pour chaque ligne du tableau (de sorte que vous ne devez pas écrire width="80" pour la première td dans chaque ligne (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>

vous pouvez également grouper les cols, permet de dire que la première et la deuxième colonne devrait obtenir un with de 80, le troisième devrait obtenir 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>

Answer 2

Oui, ils sont tous recommandés par le W3C. Voici les liens directs vers la documentation:

• col
• colgroup
• colspan
• rowspan

Answer 3

rowspan et colspan sont des attributs qui permettent au concepteur de cellules « de fusion » - un peu comme la même commande dans Excel (par exemple)

.

col et colgroup permettent au concepteur d'appliquer à une colonne css verticale, plutôt que d'avoir à appliquer à des cellules individuelles css dans une colonne. Sans cela, cette tâche serait beaucoup plus difficile que des tables HTML en rangée.

Les quatre d'entre eux sont valides.

Pour référence ultérieure, essayez http://reference.sitepoint.com/html