Tabele HTML. Proprietatea CSS de aliniere a textului text-align. Proprietatea CSS border-spacing. Atributele: colspan și linespan.

Susține Lectii-Virtuale!

Tabel HTML - Titluri aliniate la stânga (Left-align Headings)

În mod implicit, titlurile tabelelor sunt îngroșate și centrate.
Pentru a alinia la stânga titlurile tabelului, utilizați proprietatea CSS de aliniere a textului (text-align):

Exemplu:

th {
  text-align: left;
}

Tabel HTML - Adăugarea spațierii frontierelor (Adding Border Spacing)

Distanța de frontieră (border spacing) specifică spațiul dintre celule.
Pentru a seta distanța de graniță pentru o tabelă, utilizați proprietatea CSS border-spacing :

Exemplu:

table {
  border-spacing: 5px;
}

Notă: Dacă tabelul are collapsed borders, border-spacing nu are efect.

Tabel HTML - Celule care acoperă multe coloane

Pentru a face cell span mai mult de o coloană, utilizați atributul colspan:

Exemplu:

<table style="width:100%">
  <tr>
    <th>Nume</th>
    <th colspan="2">Telefon</th>
  </tr>
  <tr>
    <td>Ion Ionescu</td>
    <td>55577854</td>
    <td>55577855</td>
  </tr>
</table>

Tabel HTML - Celule care acoperă multe rânduri

Pentru a face un interval de celule (cell span) mai mult de un rând, utilizați atributul linespan:

Exemplu:

<table style="width:100%">
  <tr>
    <th>Nume:</th>
    <td>Ion Ionescu</td>
  </tr>
  <tr>
    <th rowspan="2">Telefon:</th>
    <td>55577854</td>
  </tr>
  <tr>
    <td>55577855</td>
  </tr>
</table>