HTML’de bir tablo oluşturmak için aşağıdaki adımları takip edebilirsiniz:

Html ile Tablo Oluşturma Uygulaması Nasıl Yapılır?

<table> etiketi ile bir tablo oluşturun.

html

<table>
  <!-- Tablo içeriği buraya gelecek -->
</table>

<tr> etiketi ile bir satır oluşturun. Bu, tablonun birinci satırını oluşturur.

html

<table>
  <tr>
    <!-- Satır içeriği buraya gelecek -->
  </tr>
</table>

<th> veya <td> etiketleri ile tablo hücreleri oluşturun. <th> etiketi, tablonun sütun başlıklarını belirtirken, <td> etiketi ise veri hücrelerini belirtir.

html

<table>
  <tr>
    <th>Sütun 1</th>
    <th>Sütun 2</th>
  </tr>
  <tr>
    <td>Veri 1.1</td>
    <td>Veri 1.2</td>
  </tr>
  <tr>
    <td>Veri 2.1</td>
    <td>Veri 2.2</td>
  </tr>
</table>

Yukarıdaki kod, iki sütunlu, üç satırlı bir tablo oluşturur. İlk satır, sütun başlıklarını belirten <th> etiketleri ile oluşturulur. Sonraki iki satır ise <td> etiketleri ile veri hücrelerini belirtir.

İsteğe bağlı olarak, colspan veya rowspan özelliklerini kullanarak hücrelerin genişliğini veya yüksekliğini artırabilirsiniz. colspan, bir hücrenin birden fazla sütuna yayılmasını sağlar. rowspan, bir hücrenin birden fazla satıra yayılmasını sağlar.

<table>
  <tr>
    <th colspan="2">Sütun 1 ve 2</th>
  </tr>
  <tr>
    <td>Veri 1.1</td>
    <td rowspan="2">Veri 1.2 ve 2.2</td>
  </tr>
  <tr>
    <td>Veri 2.1</td>
  </tr>
</table>

Yukarıdaki kod, iki sütunlu ve üç satırlı bir tablo oluşturur. İlk satırda, <th> etiketi colspan özelliği ile iki sütuna yayılır. İkinci satırda, ilk hücre normal boyutunda, ikinci hücre ise rowspan özelliği ile iki satıra yayılır.

Tablolar, HTML’de verileri düzenlemenin en kolay yollarından biridir. Yukarıdaki örnekler, tablolar oluşturmanın en temel yollarını göstermektedir. Daha fazla tablo özelliği ve örnekleri için, HTML tabloları

Bu uygulamada herhangi bir sorun yaşarsanız aşağıya yorum olarak bırakabilirsiniz. Bunun yanı sıra web sitemizdeki diğer hazır Html programlama örneklerine ulaşmak için bu linke tıklayabilirsiniz.

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir