Sefik.net - Tablo Oluşturma <table> etiketi

<Table> Etiketi ile Kullanılan Parametreler 1

Tablo Oluşturma <table> etiketi

Hazırlamış olduğunuz web sayfanıza tablo eklemek için kullanılan etikettir. Bir tablo <Table> etiketi ile başlayıp </Table> etiketi ile biter. Tablolar satır ve sütunlardan oluşur. Satırların ve sütunların kesiştikleri kutuya “hücre” adı verilir.

<tr> etiketi : Tabloda satır oluşturmak için kullanılır

<td> etiketi : Tabloda sütunlar oluşturmak için kullanılır.

<th> etiketi : Tabloda başlık alanı oluştururken kullanılabilir. td ile aynı işi yapar ancak hücre içi metin kalın ve ortalı bir şekilde görüntülenir.

Örnek: 2 Satır 1 sütundan oluşan tablo

<html>
  <head>
    <title>Tablo Örneği</title>
  </head>
  <body>
    <table border="1">   
      <tr> <!-- Birinci satır başlangıcı-->
        <td>Birinici satır</td>
      </tr> <!-- Birinci satır sonu -->    
      <tr>  <!-- İkinici satır başlangıcı -->
        <td>
          İkinci satır
        </td>
      </tr>  <!-- İkinci satır sonu -->
    </table>
  </body>
</html>

 
            Birinici satır    
               İkinci satır

Örnek: 1 Satır 2 sütundan oluşan tablo

<table border="1">   
  <tr> <!-- Birinci satır başlangıcı-->
    <td>Birinici sütun </td> 
    <td>İkinci sütun </td> 
  </tr> <!-- Birinci satır sonu -->    
</table>

Birinici sütun

İkinci sütun

Yukarıdaki örneklerde görüldüğü gibi bir tablo <table> etiketi ile başlar ve </table> etiketi ile sonlanır. Bu etiketler arasında her bir satır <tr> sütunlar </tr> şeklinde oluştur. Tablodaki herbir sütun <td>Hücrede görünecek metin </td> şeklinde <tr></tr> etiketleri arasına eklenir. Örneklerde de görüldüğü gibi td etiketleri mutlaka tr etiketleri içerisine eklenmelidir.

Örnek : 2 sütun 3 satırdan oluşan bir tablo örneği

<table border="1">   
  <tr>
    <td>1.Satır 1.sütun </td> 
    <td>1.Satır 2.sütun </td> 
  </tr>
  <tr>
    <td>2.Satır 1.sütun </td> 
    <td>2.Satır 2.sütun </td> 
  </tr>
  <tr>
    <td>3.Satır 1.sütun </td> 
    <td>3.Satır 2.sütun </td> 
  </tr>
</table>

1.Satır 1.sütun	1.Satır 2.sütun
2.Satır 1.sütun	2.Satır 2.sütun
3.Satır 1.sütun	3.Satır 2.sütun

Örnek : 4 sütun 2 satırdan oluşan bir tablo örneği

<table border="1">   
  <tr>
    <td>1.Satır 1.sütun </td> 
    <td>1.Satır 2.sütun </td> 
    <td>1.Satır 3.sütun </td> 
    <td>1.Satır 4.sütun </td> 
  </tr>
  <tr>
    <td>2.Satır 1.sütun </td> 
    <td>2.Satır 2.sütun </td> 
    <td>2.Satır 3.sütun </td> 
    <td>2.Satır 4.sütun </td> 
  </tr>
</table>

1.Satır 1.sütun	1.Satır 2.sütun	1.Satır 3.sütun	1.Satır 4.sütun
2.Satır 1.sütun	2.Satır 2.sütun	2.Satır 3.sütun	2.Satır 4.sütun

Örnek : Th etiketi 4 sütun 2 satır vebaşlık alanından oluşan bir tablo örneği

<table border="1">   
  <tr>
    <th>Başlık 1</th> 
    <th>Başlık 2</th> 
    <th>Başlık 3</th> 
    <th>Başlık 4</th> 
  </tr>
  <tr>
    <td>1.Satır 1.sütun </td> 
    <td>1.Satır 2.sütun </td> 
    <td>1.Satır 3.sütun </td> 
    <td>1.Satır 4.sütun </td> 
  </tr>
  <tr>
    <td>2.Satır 1.sütun </td> 
    <td>2.Satır 2.sütun </td> 
    <td>2.Satır 3.sütun </td> 
    <td>2.Satır 4.sütun </td> 
  </tr>
</table>

Başlık 1	Başlık 2	Başlık 3	Başlık 4
1.Satır 1.sütun	1.Satır 2.sütun	1.Satır 3.sütun	1.Satır 4.sütun
2.Satır 1.sütun	2.Satır 2.sütun	2.Satır 3.sütun	2.Satır 4.sütun

Örnek Soru : 10 kişilik bir sınıf için numara , ad, soyad, başlıkllarından oluşan öğrenci bilgilerini içeren tabloyu oluşturunuz.

Ekleyen:admin