Puis-je avoir un en-tête de table HTML sur deux colonnes de table? Comme la fusion et le centre dans Excel?

StackOverflow https://stackoverflow.com/questions/8996466

Question

Je veux avoir une en-tête de table être centrée sur deux colonnes de table côte à côte. Est-ce possible?

Était-ce utile?

La solution

<th colspan="2">. This .</th>

Pour extrapoler un peu ...

<table>
  <thead>
    <tr>
      <th>Single Column</th>
      <th colspan="2">Double Column</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Column One</td>
      <td>Column Two</td>
      <td>Column Three</td>
    </tr>
  </tbody>
</table>

Cela devrait vous en donner suffisamment pour travailler.

Autres conseils

Si vous n'avez que 2 colonnes, je vous suggère d'utiliser <caption>. Sinon, utilisez Colspan comme suggéré dans d'autres réponses.

<table>
  <caption>This will span all columns.</caption>
  <tr><td>column one</td><td>column two</td></tr>
</table>

Bien sûr. Prière de se référer à cette page. Vous cherchez un attribut appelé colspan Pour les cellules d'en-têtes de table.

Nous pouvons le faire mieux.

<table border="1"> 
  <tr>
    <th colspan="1" scope="colgroup">Test Heading</th>
    <th colspan="3" scope="colgroup">Mars</th>
    <th colspan="3" scope="colgroup">Venus</th>
    <th colspan="3" scope="colgroup">Test</th>
  </tr>
  <tr>
    <th rowspan="2"></th>
    <th scope="col">Produced</th>
    <th scope="col">Sold</th>
    <th scope="col">Sold</th>
    <th scope="col">Produced</th>
    <th scope="col">Sold</th>
    <th scope="col">Sold</th>
    <th scope="col">Test 1</th>
    <th scope="col">Test 2</th>
    <th scope="col">Test 3</th>
  </tr>
</table>

Veuillez visiter Table Ref de W3.org Si vous voulez en savoir plus.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top