HTML

HTML Tablo Hücre Birleştirme Örnekleri

Bu yazıda HTML ile oluşturulan tabloarın hücrelerini nasıl birleştireceğinizi göstereceğim.

HTML ile hücre birleştirme iki şekilde olmaktadır. Hücreler yatay (satır ) olarak  birleştirile bileceği gibi dikey (sütun) olarak da birleştirilebilir. Ayrı ayrı bu kavramları örnekler ile inceleyeceğiz.

HTML Tablo Oluşturma

İlk olarak HTML tablo nasıl oluşturuluyor biraz inceleyelim. Bir HTML tablosu en az 3 etiketin bir araya gelmesiyle oluşturulur. Bu etiketler şunlardır;

  • <table>: tablonun genel çerçevesini belirtir.
  • <tr> : tablodaki satırları belirtir.
  • <td> : tablodaki hücreleri belirtir.

Örnek: Bunu basit bir örnekle açıklayalım.  2 sütun 3 satırlı bir tablomuz olduğunu düşünelim. Yazmamız gereken HTML kodu şu şekilde olacaktır.

Çıktı:

HTML Hücre Birleştirme (Sütun Birleştirme)

Sütun birleştirmek için colspan niteliği kullanılmaktadır. Uzatılacak hücre sayısı yazılır ve ardındaki hücreler belirtilen sayı kadar uzatılır.

Örnek: İlk olarak yatay bir alandaki hücreleri yan yana nasıl birleştireceğimizi görelim. Sütun birleştirme kavramı için yukarıdaki 1.satırdaki 2. ve 3. hücreleri birleştirmeyi planladığımızı düşünelim. Yani ilk satırda 2 tane hücremiz olacak. Bu işlemi yapan kod şu şekilde olacaktır.

Çıktı:

HTML Hücre Birleştirme (Satır Birleştirme)

HTML hücrelerinin satırlarını birleştirmek için rowspan kullanılır. Altındaki hücreleri belirtilen hücre kadar aşağı kaydırır.rowspan eklendikten sonraki alt satırlarda bulunan hücreler belirtilen sayı kadar silinir.

Örnek: Yine yukarıdaki örnekte 1. ve 2. satırdaki 2.hücreleri birleştirelim.

Çıktı:

HTML Tablo Hücre Birleştirme Örnekeleri

Örnek 1:

Kod:

 

Örnek 2:

Kod:

 

Örnek 3:

HTML Tablo Örnekleri 8
HTML Tablo Örnekleri 8

Kod:

 

 

 

 

 

 

 

 

 

 

3 Yorum

Yorum yapmak için tıklayın

  • Ben html ile ilgili özel bir soru sormak istiyorum. Cevaplarsanız çok sevinirim, ben html bir site yaptım ancak arama motorlarında sadece ilgili sayfanın kendisi açılıyor, sitenin hepsi açılmıyor, sayfalar, frameler birbirinden ayrı şekilde arama motorlarında çıkıyor, ben bunları nasıl birleştirebilirim, yani ilgili bir sayfa tıklandığında bütün sitenin görüntüsünün çıkması için ne yapabilirim.. tşkler.