Takip Edin

HTML

HTML’de Tablolar

HTML’de tablolar, verileri satırlar ve sütunlar halinde düzenlemenizi sağlar. Genellikle ürün listeleri, müşteri bilgileri, finansal raporlar gibi tablo verilerini göstermek için kullanılır.

Bir HTML tablosu, <table> elemanıyla tanımlanır.

Her tablo satırı, <tr> elemanıyla tanımlanır. Bir tablo başlığı, <th> elemanıyla tanımlanır. Tablo başlıkları, varsayılan olarak kalın ve ortalanmıştır. Bir tablo verisi/hücresi, <td> elemanıyla tanımlanır.

Not: <td> elemanları, tabloların veri kapsayıcılarıdır. Her türlü HTML elemanı içerebilirler: Metinler, resimler, listeler, başka tablolar vb.

Tablolara Kenarlık Ekleme

Tablolar, varsayılan olarak kenarlığa sahip değildir. Tablolara kenarlık eklemek için CSS border özelliği kullanılır.

Tablolara Daraltılmış Kenarlıklar Ekleme

Kenarlıkların bir kenarlığa daraltılması için CSS border-collapse özelliği kullanılır.

Tablo Hücrelerine İç Boşluk(Padding) Ekleme

Tablo hücrelerinde iç boşluk, hücre içeriği ve onun kenarlıkları arasındaki boşluğu belirtir. Tablo hücrelerinde içeriğin etrafına daha fazla boşluk eklemek için CSS padding özelliği kullanılır.

Sola Hizalı Başlıklar

Tablo başlıkları, varsayılan olarak kalın ve ortalanmıştır.

Tablo başlıklarını sola hizalamak için CSS text-align özelliği kullanılır.

Kenarlık Aralığı Ekleme

Hücreler arasındaki boşluk, kenarlık aralığı ile belirtilir.

Bir tablonun kenarlık aralığını ayarlamak için CSS border-spacing özelliği kullanılır.

Not : Eğer tablo, daraltılmış kenarlıklara sahipse border-spacing özelliğinin bir etkisi kalmayacaktır.

Birden Fazla Sütunu Kapsayan Hücreler Ekleme

Bir hücrenin birden fazla sütunu kapsaması için colspan özelliği kullanılır.

Birden Fazla Satırı Kapsayan Hücreler Ekleme

Bir hücrenin birden fazla satırı kapsaması için rowspan özelliği kullanılır.

Tablolara Başlık Eklemek

Bir tabloya başlık eklemek için <caption> elemanı kullanılır.

Not : <caption> etiketi, <table> etiketinden hemen sonra eklenmelidir.

Tablolara Özel Biçimler Tanımlama

Bir tabloya özel bir biçim tanımlamak için tabloya id özelliği eklenir.

Tablolar İçin Üst Bilgi, Gövde ve Alt Bilgi Tanımlama

HTML, sırasıyla üst bilgi, gövde ve alt bilgi bölgelerini tanımlayarak daha yapılandırılmış tablolar oluşturmanıza yardımcı olan <thead>, <tbody> ve <tfoot> elemanlarına sahiptir.

Devamını oku

Popüler

error: Content is protected !!