Anasayfa / Web Tasarım / HTML / HTML Tablo Oluşturma (tr – td) (Ders 4)

HTML Tablo Oluşturma (tr – td) (Ders 4)

Html’de tablo oluşturma mantığı şu şekildedir. Önce tablo tanımlanır, sonrasında sırasıyla satırları ve sütunları tanımlanır. Şimdi etiketlerimizi inceleyelim.

<table>…</table>

Html sayfası içerisinde bir tablo oluşturmak için <table> etiketi kullanılır. Bu etiket tablomuzun tamamını içinde barındırır.

<tbody>…</tbody>

Tablomuzun görünen kısımlarını içerir. <body> etiketi ile aynı yapıdadır.

<tr>…</tr>

Tablomuzun satırlarını oluşturan etikettir.

<td>…</td>

Tablomuza sütun ekleyen komuttur.

Şimdi bir marketin stok durumunu gösteren örnek bir tablo oluşturalım.

<table>
 <tbody>
   <tr>
      <td>ÜRÜN ADI</td>
      <td>STOK MİKTARI</td>
   </tr>
   <tr>
      <td>Çikolata</td>
      <td>100 adet</td>
   </tr>
   <tr>
      <td>Pirinç</td>
      <td>50 kg</td>
   </tr>
   <tr>
      <td>makarna</td>
      <td>20 paket</td>
   </tr>
   <tr>
      <td>Cips</td>
      <td>30 adet</td>
   </tr>
 </tbody>
</table>

Yazdığımız bu kodun sonucu aşağıdaki gibi olacaktır.

ÜRÜN ADISTOK MİKTARI
Çikolata100 adet
Pirinç50 kg
Makarna20 paket
Cips30

Bir sonraki yazımızda görüşmek üzere…

Hakkında Furkan Yağmur

Check Also

web-gemisi

HTML Form Oluşturma 1. Kısım (Ders 9)

Bir web sayfasında formlar ile çalışmak için sadece html dilini bilmek yetmez. Bunun nedenini öğrenmek …

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir