HTML <td> mpangilio

Makadaro na matumizi

<td> Tegesi inaangalia kitambaa cha data cha kikweli cha HTML.

Kikweli cha HTML kinahofaa kitambaa kumi:

  • Kitambaa cha kichwa - ina habari ya kichwa (kwa <th> Kichunguzi cha elementi)
  • Kitambaa cha data - ina data (kwa <td> Kichunguzi cha elementi)

Kwa kawaida,<td> Matukio ya elementi ni kawaida, na kusimama kwenye uangalifu wa kushoto.

Matukio ya <th> yanafikia kwa uharibifu na kusimama kwa kuzingatia.

Tazama pia:

Mwongozo wa HTML:HTML Tafuta

Mwongozo wa DOM wa HTML:Mfumo wa Data ya Kikweli

Mwongozo wa CSS:Mwongozo wa misingi wa kikweli

Mfano

Mfano 1

Kikweli cha HTML kinasema msingi wa kutosha na mawili na makikweli mitano:

<table>
  <tr>
    <td>Kitambaa A</td>
    <td>Kitambaa B</td>
  </tr>
  <tr>
    <td>Kitambaa C</td>
    <td>Kitambaa D</td>
  </tr>
</table>

Kutenda kwa mwenyewe

Mfano 2

Kuhusiana na uangalifu <td> kwa matukio (kwa CSS):

<table style="width:100%">
  <tr>
    <th>Mwezi</th>
    <th>Chagua</th>
  </tr>
  <tr>
    <td>Januari</td>
    <td style="text-align:right">￥3400</td>
  </tr>
  <tr>
    <td>Februari</td>
    <td style="text-align:right">￥4500</td>
  </tr>
</table>

Kutenda kwa mwenyewe

Mfano 3

Kuhusiana kuhakutumia kwa kuongeza rangi ya nguo ya msingi kwenye kikweli cha msingi (kwa CSS):

<table>
  <tr>
    <th>Mwezi</th>
    <th>Chagua</th>
  </tr>
  <tr>
    <td style="background-color:#FF0000">Januari</td>
    <td style="background-color:#00FF00">¥3400</td>
  </tr>
 </table>

Kutenda kwa mwenyewe

Mfano 4

Kuhakika kwa kufungua ukweli wa ukinga wa tablica (kwa CSS):

<table>
  <tr>
    <th>Mwezi</th>
    <th>Chagua</th>
  </tr>
  <tr>
    <td style="height:100px">Januari</td>
    <td style="height:100px">¥3400</td>
  </tr>
</table>

Kutenda kwa mwenyewe

Mfano 5

Kuhakika kwa kuzingatia hatua ya kufungua kwa tablica (kwa CSS):

<table>
  <tr>
    <th>Shairi</th>
  </tr>
  <tr>
    <td style="white-space:nowrap">Kwa kumfukia Mjini Bwana kwa mabaya ya miguu, mabaya ya miguu ya milima hufikia kwa siku moja. Mabaya ya watu wa milima hawakupungua, mifuriko ya mifuriko ya mifuriko ya milima yanaendelea.</td>
  </tr>
</table>

Kutenda kwa mwenyewe

Mfano 6

Kuhakika kwa kuelekea kimoja kwa usiku wa tablica: <td> kwa matukio (kwa CSS):

<table style="width:50%;">
  <tr>
    <th>Mwezi</th>
    <th>Chagua</th>
  </tr>
  <tr style="height:100px">
    <td style="vertical-align:bottom">Januari</td>
    <td style="vertical-align:bottom">¥3400</td>
  </tr>
</table>

Kutenda kwa mwenyewe

Mfano 7

Kuhakika kwa kufungua ukweli wa ukinga wa tablica (kwa CSS):

<table style="width:100%">
  <tr>
    <th>Mwezi</th>
    <th>Chagua</th>
  </tr>
  <tr>
    <td style="width:70%">Januari</td>
    <td style="width:30%">¥3400</td>
  </tr>
</table>

Kutenda kwa mwenyewe

Mfano 8

Kuhakika kwa kufungua kichwa cha tablica:

<table>
  <tr>
    <th>Jina</th>
    <th>Barua pepe</th>
    <th>Telefoni</th>
  </tr>
  <tr>
    <td>Bill Gates</td>
    <td>bill.gates@example.com</td>
    <td>138-1234-5678</td>
  </tr>
</table>

Kutenda kwa mwenyewe

Mfano 9

Kuhakika kwa kufungua tablica na kichwa:

<table>
  <caption>Mwezi wa chagua</caption>
  <tr>
    <th>Mwezi</th>
    <th>Chagua</th>
  </tr>
  <tr>
    <td>Januari</td>
    <td>¥3400</td>
  </tr>
  <tr>
    <td>Februari</td>
    <td>¥4500</td>
  </tr>
</table>

Kutenda kwa mwenyewe

Mfano 10

Kuhakika kwa kufungua ukinga wa tablica kwa matukio ya mawili au mitatu:

<table>
  <tr>
    <th>Jina</th>
    <th>Barua pepe</th>
    <th colspan="2">Telefoni</th>
  </tr>
  <tr>
    <td>Bill Gates</td>
    <td>bill.gates@example.com</td>
    <td>138-1234-5678</td>
    <td>186-2345-6789</td>
  </tr>
</table>

Kutenda kwa mwenyewe

Kivyo

Kivyo Mivyo Maelezo
colspan Numberi Kumegawanyia kifaa kinavyo
headers header_id Kumegawanyia kifaa cha kichwa kinavyo
rowspan Numberi Kumegawanyia mitaani ya kifaa

Matumizi ya Kivyo

<td> Mafupi yanayosalia kinavyotumia matukio ya kivyo Matumizi ya Kivyo katika HTML.

Matukio ya Kivyo

<td> Mafupi yanayosalia kinavyotumia matukio ya kivyo Matukio ya Kivyo katika HTML.

Matumizi ya CSS ya kawaida

Vile vya kawaida vya kusoma vitu vinavyotumia tabia hizo <td> Kifaa:

td {
  display: table-cell;
  vertical-align: inherit;
}

Matumizi ya Kivyo

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Msaada Msaada Msaada Msaada Msaada