Python Kod

  1. Anasayfa
  2. »
  3. Genel
  4. »
  5. HTML Tablo Site Örnekleri

HTML Tablo Site Örnekleri

admin admin - - 29 dk okuma süresi
165 0

Bu makalede, HTML tablo örnekleri ve nasıl kullanılacağı konuları ele alınmaktadır. HTML tabloları, verileri tablo formatında düzenlemek için kullanılan bir HTML elemanıdır. Tablolar,

etiketi ile başlar ve

etiketi ile biter. İçerisinde

(satır) ve

(hücre) etiketleri kullanılır.

  • =
    etiketleri ile tablonun satırları oluşturulur. Her satırda

    etiketleri ile hücreler belirtilir.
  • =Hücrelerin içine metin veya diğer HTML etiketleri yerleştirilebilir.
  • =Hücre genişliği ve yüksekliği CSS ile belirlenebilir veya HTML’de width ve height öznitelikleri kullanılabilir.
  • = etiketi ile tablonun başlık ve alt başlık hücreleri oluşturulabilir.

Tabloları biçimlendirmek için CSS kullanabilirsiniz. Örneğin, kenarlık, arkaplan rengi ve metin formatı gibi özellikler ekleyebilirsiniz. Tabloya kenarlık eklemek için CSS’te border özelliği kullanılır. Tablonun arkaplan rengini belirlemek için CSS’te background-color özelliği kullanılır. Ayrıca, tablodaki metnin rengi, boyutu, yazı tipi vb. özellikleri CSS ile belirlenebilir.

Tablo Nedir?

Tablo Nedir?

HTML tabloları, verileri tablo formatında düzenlemek için kullanılan bir HTML elemanıdır. Bir tablonun başlığı, satırları ve hücreleri bulunur. Tablolar, <table> etiketi ile başlar ve </table> etiketi ile biter. İçerisindeki veriler satırlar (<tr>) ve hücreler (<td>) şeklinde yapılandırılır. Bu yapı sayesinde veriler düzenli bir şekilde tablo içinde gösterilebilir.

Bir HTML tablosu, bir tablodaki gerçek dünyadaki veri tabanı anlamına gelmez, ancak bir konseptsel yapı sağlar. İnternet sitelerinde veya belgelerde tablolar kullanılarak bilgiler daha anlaşılır hale getirilebilir. Örneğin, finansal raporlar, spor istatistikleri veya ürün listeleri tablolar aracılığıyla sunulabilir.

Tablolar, hücre içeriği, hücre genişliği ve yüksekliği, başlık ve alt başlık gibi özelliklerle yönlendirilebilir. Hücre içeriği metin veya diğer HTML etiketlerini içerebilir. Ayrıca, CSS kullanarak tabloları biçimlendirebilir ve kenarlık, arkaplan rengi ve metin formatı gibi özellikler ekleyebilirsiniz.

İsim Soyisim Yaş
Ahmet Yılmaz 25
Ali Demir 30
  • HTML tabloları, verileri düzenlemek ve sunmak için kullanılır.
  • Tablolar, <table> etiketi ile başlar ve </table> etiketi ile biter.
  • Tablolarda başlık (<th>) ve hücreler (<td>) kullanılır.
  • Tablolar CSS ile biçimlendirilebilir.

Tabloların Yapısı

Tablolar, HTML’de verileri düzenlemek ve görsel olarak sunmak için kullanılan önemli bir araçtır. Tablolar, başlangıç etiketi olan

ve bitiş etiketi olan

ile tanımlanır. İçerisinde ise

etiketi ile satırlar oluşturulur ve her satırda

etiketi ile hücreler belirtilir.

Tablonun yapısı basit bir hiyerarşik yapıya sahiptir.

etiketi tablonun başlangıcını gösterirken,

etiketi tablonun sonunu belirtir. Her satırı oluşturmak için

etiketi kullanılır ve her satırın içindeki verileri belirtmek için

etiketleri kullanılır.

Satır 1, Hücre 1 Satır 1, Hücre 2
Satır 2, Hücre 1 Satır 2, Hücre 2

Bu örnek tabloda 2 satır ve 2 hücre bulunur. Satırlar

etiketiyle oluşturulur ve her satır içindeki hücreler

etiketiyle belirtilir. Tablolar, bu basit yapıya göre istenilen sayıda satır ve hücre içerebilir.

Satır ve Hücreler

Tablonun düzenini sağlamak için, her tablo satırı

etiketi kullanılarak oluşturulur. Her bir satırda ise

etiketi ile hücreler belirtilir. Bu hücreler, tablonun bir sütunu veya bir veri alanını temsil eder.

Bir örnekle açıklayacak olursak, bir masa üzerindeki tablo düşünelim. Tablonun her bir satırı ise bir sandalyeyi temsil eder. Her sandalyenin ise farklı bir hücreye yerleştirildiğini düşünebiliriz. Tabloyu tamamlamak için, her sandalye hücresini

etiketi ile belirtmeliyiz.

Ayrıca, tablodaki satırların ardışık olması önemlidir. Yani, bir satırın sonunda mutlaka

etiketini kullanarak sonlandırmalı ve bir sonraki satıra geçiş yapmalıyız. Bu şekilde tablonun düzeni sağlanır ve içerik düzenli bir şekilde görüntülenir.

Tabloları oluştururken, dikkat etmemiz gereken bir nokta da her satırın aynı sayıda hücre içermesi gerektiğidir. Yani, her satırda belirtilen hücre sayısı kadar hücre olmalıdır. Aksi takdirde, tablo yapısal olarak düzgün görünmeyebilir ve içeriğin anlaşılması zorlaşabilir.

Hücre İçeriği

=Hücreler, HTML tablolarının temel yapı taşlarıdır ve içlerine metin veya diğer HTML etiketleri yerleştirilebilir. Bu sayede tablonun her hücresine istediğimiz şekilde içerik ekleyebilir ve tabloyu istediğimiz gibi biçimlendirebiliriz.

Metin içeriği eklemek için hücrenin içine direkt olarak yazılan metinler veya HTML etiketleri kullanılabilir. Örneğin, tabloda bulunan bir hücreye “Merhaba Dünya!” yazısı eklemek için şu şekilde bir kod kullanabiliriz:

Merhaba Dünya!

Bu şekilde hücreye sadece metin eklemiş oluruz. Ancak, hücreye daha karmaşık içerikler de ekleyebiliriz. Örneğin, hücreye bir resim eklemek için <img> etiketini kullanabiliriz:

Tablodaki bir resim

Aynı şekilde, hücreye bir bağlantı eklemek için <a> etiketini kullanabiliriz:

Örnek bir bağlantı

Bu örneklerde görüldüğü gibi, hücrelere istediğimiz her türlü içeriği ekleyebiliriz. Bu sayede tablolarda metinler, resimler, bağlantılar ve daha pek çok içeriği kolaylıkla kullanabiliriz.

Hücre Genişliği ve Yüksekliği

=Hücre genişliği ve yüksekliği CSS ile belirlenebilir veya HTML’de width ve height öznitelikleri kullanılabilir.

HTML tablolarında, hücrelerin genişlik ve yükseklik değerini CSS ile belirleyebilirsiniz. Tabloyu oluştururken width ve height özniteliklerini kullanarak hücrelerin boyutunu istediğiniz gibi ayarlayabilirsiniz.

Bunun yanı sıra, hücrelerin genişlik ve yükseklik değerini CSS kullanarak da belirleyebilirsiniz. CSS’te width ve height özelliklerini kullanarak hücrelere istediğiniz boyutları verebilirsiniz. Örneğin, width özelliğini kullanarak hücrenin genişliğini belirleyebilir ve height özelliği ile de hücrenin yüksekliğini ayarlayabilirsiniz.

HTML’de hücre genişliği ve yüksekliği belirlemek için öznitelikleri kullanmanın yanı sıra CSS kullanmak daha esnek bir seçenektir. CSS ile istediğiniz hücre boyutlarını belirleyebilir ve tablolarınıza istediğiniz şekilde şekil verebilirsiniz.

width

=width

Tabloları oluştururken hücrelerin genişliği ve yüksekliği önemlidir. Bu özellikler, tablonun düzenli ve görsel olarak hoş görünmesini sağlar. Hücrelerin genişliğini ve yüksekliğini belirlemek için CSS kullanabilir veya HTML’de width ve height özniteliklerini kullanabilirsiniz.

width özelliği, hücrenin genişlik değerini belirler. Örnek olarak, hücrenin genişliğini piksel cinsinden belirlemek için width=”300px” şeklinde kullanabilirsiniz. Eğer hücrenin genişliğini yüzde cinsinden belirlemek isterseniz, width=”50%” gibi bir değer atayabilirsiniz. Belirlediğiniz genişlik değeri, tablonun diğer hücreleriyle orantılı olarak ayarlanır.

Benzer şekilde, height özelliği de hücrenin yükseklik değerini belirler. height özelliğini kullanarak hücrenin yüksekliğini piksel veya yüzde cinsinden belirleyebilirsiniz. Örneğin, height=”100px” veya height=”25%” gibi değerler kullanabilirsiniz.

Hücrelerin genişliği ve yüksekliği, tablonun içeriğiyle uyumlu olmalı ve okunabilirliği artırmalıdır. Ayrıca, responsive tasarım için hücre boyutlarını ayarlarken dikkatli olmanız da önemlidir. Böylece tablonun farklı ekran boyutlarına uyum sağlayabilmesini sağlarsınız.

ve

Makalede, HTML tablo örnekleri ve nasıl kullanılacağı konuları ele alınmaktadır. HTML tabloları, verileri tablo formatında düzenlemek için kullanılan bir HTML elemanıdır. Tablolar,

etiketi ile başlar ve

etiketi ile biter. İçerisinde

(satır) ve

(hücre) etiketleri kullanılır.

Satır ve Hücreler:

etiketleri ile tablonun satırları oluşturulur. Her satırda

etiketleri ile hücreler belirtilir.

Hücre İçeriği:
Hücrelerin içine metin veya diğer HTML etiketleri yerleştirilebilir.

Hücre Genişliği ve Yüksekliği:
Hücre genişliği ve yüksekliği CSS ile belirlenebilir veya HTML’de width ve height öznitelikleri kullanılabilir.

Başlık ve Alt Başlık:

etiketi ile tablonun başlık ve alt başlık hücreleri oluşturulabilir.

Tabloları Biçimlendirmek:
CSS kullanarak tabloları biçimlendirebilirsiniz. Örneğin, kenarlık, arkaplan rengi ve metin formatı gibi özellikler ekleyebilirsiniz.

Kenarlık Eklemek:
Tabloya kenarlık eklemek için CSS’te border özelliği kullanılır.

Arkaplan Rengi:
Tablonun arkaplan rengini belirlemek için CSS’te background-color özelliği kullanılır.

Metin Formatı:
Tablodaki metnin rengi, boyutu, yazı tipi vb. özellikleri CSS ile belirlenebilir.

height

height

Tabloların hücrelerinin genişliği ve yüksekliği belirlenebilir. Bu, tabloların görünümünü özelleştirmek için kullanışlı bir özelliğidir. Hücrelerin yüksekliği, CSS ile belirlenebilir veya HTML'de bulunan height özniteliği kullanılarak ayarlanabilir.

Özel bir hücre yüksekliği belirtmek için height özniteliği kullanılabilir. Örneğin, bir hücrenin yüksekliğini 50 piksel olarak ayarlamak için aşağıdaki gibi bir HTML kodu kullanılabilir:

İçerik

Bu kod, hücrenin yüksekliğini 50 piksel olarak belirler. İsteğe bağlı olarak CSS kullanarak da hücre yüksekliği düzenlenebilir. Tabloları biçimlendirme konusunda daha fazla bilgi için, CSS kullanarak tabloları özelleştirme olasılıklarını keşfedebilirsiniz.

öznitelikleri kullanılabilir.

HTML tablolarında hücre genişliği ve yüksekliği, width ve height öznitelikleri kullanılarak belirlenebilir. Bu özellikler, tablonun istenilen boyutlarda olmasını sağlar.

Aşağıda örnek bir tablo gösterilmiştir:

Ad Soyad Yaş
Ali Yılmaz 25
Ayşe Demir 32

Yukarıdaki tabloda, width özelliği kullanılarak hücrelerin genişliği belirlenmiştir. Ayrıca, height özelliği kullanılarak hücrelerin yüksekliği belirlenmiştir.

Tabloları biçimlendirmek için CSS kullanmak da mümkündür. CSS ile tablolara arkaplan rengi, kenarlık ve metin formatı gibi özellikler eklemek mümkündür. Bu sayede tablolar daha görsel ve dikkat çekici hale getirilebilir.

Tablolarda öznitelikler kullanarak istediğiniz şekilde biçimlendirme yapabilirsiniz. Kullanımı kolay ve esnek olmaları, HTML tablolarının popüler bir biçimlendirme yöntemi olmasını sağlar.

Başlık ve Alt Başlık

Başlık ve alt başlık hücreleri, HTML tablosunda bilgilerin daha iyi organize edilmesini sağlar. Başlık hücreleri, tablonun üst kısmında yer alan ve genellikle diğer hücrelere göre daha büyük ve kalın yazılmış olan hücrelerdir. Alt başlık hücreleri ise tabloda her sütunun başlığını temsil eden ve genellikle farklı bir renkte veya biçimde yazılmış olan hücrelerdir.

Başlık ve alt başlık hücreleri oluşturmak için <th> etiketi kullanılır. Bu etiket, normal hücrelerden farklı olarak başlık ve alt başlık için özel bir biçimlendirme sağlar. Örneğin, başlık hücrelerini ortalamak veya alt başlık hücrelerine farklı bir arkaplan rengi uygulamak gibi işlemler yapabilirsiniz.

Başlık 1 Başlık 2 Başlık 3
Hücre 1 Hücre 2 Hücre 3

Yukarıdaki örnekte, başlık hücreleri <th> etiketiyle oluşturulmuştur. Bunlar diğer hücrelerden farklı bir biçimlendirmeyle gösterilirken, normal hücreler <td> etiketiyle oluşturulmuştur.

Adı Soyadı Yaş
Ahmet Yılmaz 25
Ayşe Kara 30

Yukarıdaki örnekte, bir kişi listesi içeren bir tablo bulunmaktadır. Kişilerin adı, soyadı ve yaş bilgileri sütun başlıklarıyla ayrılmıştır. Bu şekilde, tablonun daha anlaşılır ve düzenli görünmesi sağlanmıştır.

Tabloları Biçimlendirmek

Tabloları biçimlendirmek için CSS kullanabilirsiniz. CSS’in sağladığı özellikleri kullanarak tablolarınıza çeşitli stil ve tasarımlar ekleyebilirsiniz. Örneğin, kenarlık, arkaplan rengi ve metin formatı gibi özellikleri uygulayarak tablolarınızı daha çekici hale getirebilirsiniz.

Tablolara kenarlık eklemek için CSS’in border özelliğini kullanabilirsiniz. Bu özellik sayesinde tablolara çerçeve kenarları ekleyebilirsiniz. Ayrıca, tablonun arkaplan rengini belirlemek için CSS’in background-color özelliğini kullanabilirsiniz. Bu şekilde tablonun arkaplanını istediğiniz renge ayarlayabilirsiniz.

Metin formatı da tablolarınızı biçimlendirmeniz için önemli bir özelliktir. CSS ile tablodaki metnin rengini, boyutunu, yazı tipini ve stilini belirleyebilirsiniz. Böylece tablonuzdaki metinleri vurgulayabilir veya okunabilirliği artırabilirsiniz.

Kenarlık Eklemek

border özelliği kullanılır. Bu özellik, tabloya kenarlık ekleyerek, hücrelerin sınırlarını belirginleştirmenizi sağlar. Kullanabileceğiniz değerler arasında solid, dashed, double gibi çeşitli kenarlık stilleri bulunur. Ayrıca, kenarlık rengini de belirleyebilirsiniz.

border

Tabloya kenarlık eklemek, HTML ve CSS kullanarak yapılabilir. Border özelliği, tabloya kenarlık eklemekte kullanılan bir CSS özelliğidir. Kenarlık, tablonun dış sınırlarını çevreleyen bir çizgidir ve tabloya biçim ve yapı sağlar.

Border özelliği, farklı özellikleri kullanarak tablonun kenarlık stilini, genişliğini, rengini ve diğer özelliklerini ayarlamak için kullanılabilir. Örneğin, solid, dashed veya dotted gibi farklı stilde kenarlık oluşturabilirsiniz.

Özellik Açıklama
border-style Kenarlık stilini belirler (solid, dashed, dotted vb.).
border-width Kenarlık genişliğini belirler (px, cm, em vb.).
border-color Kenarlık rengini belirler (örn. red, #ff0000, rgb(255, 0, 0) vb.).

Aşağıda, CSS kullanarak bir tabloya kenarlık eklemek için örnek bir kod bulunmaktadır:

table {  border: 1px solid black;  border-collapse: collapse;}

Bu kod, 1 piksel genişliğinde siyah bir kenarlık ekleyecektir. Ayrıca, border-collapse özelliği de kullanılarak tablo hücrelerinin birbirine bitişik bir şekilde görüntülenmesi sağlanabilir.

Tablo kenarlığını oluştururken CSS’yi dikkatli bir şekilde kullanmak önemlidir. İyi bir tasarım için kenarlık stilini, rengini ve genişliğini tablonun içeriğine uygun olarak ayarlamak önemlidir.

özelliği kullanılır.

özelliği kullanılır.

Tabloları biçimlendirmek için CSS kullanabilirsiniz. Tablonun görünümünü ve stiline özellikler ekleyerek daha çekici hale getirebilirsiniz. İşte tabloları biçimlendirmek için kullanabileceğiniz bazı özellikler:

  • Kenarlık Eklemek: Tabloya kenarlık eklemek için CSS’in border özelliğini kullanabilirsiniz. Bu özelliği kullanarak tablonun kenarlık kalınlığını, rengini ve stili belirleyebilirsiniz.
  • Arkaplan Rengi: Tablonun arkaplan rengini belirlemek için CSS’in background-color özelliğini kullanabilirsiniz. Bu özellik sayesinde tablonun arka planının istediğiniz renkte olmasını sağlayabilirsiniz.
  • Metin Formatı: Tablodaki metnin rengi, boyutu, yazı tipi vb. özelliklerini belirlemek için CSS’i kullanabilirsiniz. Metnin stilini belirleyerek tablonun daha okunabilir ve estetik bir görünüm kazanmasını sağlayabilirsiniz.

Tabloları biçimlendirirken CSS kullanmanız, tablolarınızı diğer içeriklerinizden ayırmak ve daha profesyonel bir görünüm sağlamak için önemlidir. CSS ile tablolarınıza istediğiniz stil ve tasarımları uygulayarak kullanıcıların dikkatini çekebilirsiniz.

Arkaplan Rengi

Arkaplan rengi, bir tablonun görünümünü belirlemek için CSS kullanarak ayarlanabilir. CSS’te background-color özelliği kullanılarak tablonun arkaplan rengi özelleştirilebilir. Bu özellik, tablonun herhangi bir bölümünün veya tüm tablonun arkaplan rengini değiştirmek için kullanılabilir. Örneğin, tablonun yalnızca başlık satırının arkaplan rengini belirlemek isterseniz, th etiketine CSS stilini eklemek yeterlidir. Ayrıca, tablonun her bir hücresinin farklı bir arkaplan rengine sahip olmasını sağlamak için td etiketinde de CSS stilleri kullanabilirsiniz.

Arkaplan rengi, tablonun görünümünü zenginleştirmek ve kullanıcıların dikkatini çekmek için kullanışlı bir özelliktir. Örneğin, bir veritabanı tablosunda belirli bir sütuna odaklanmak isterseniz, o sütunun arkaplan rengini farklı bir renkle vurgulayabilirsiniz. Ayrıca, tabloları belirli bir renk temasına uyan bir web sayfasının genel tasarımıyla uyumlu hale getirebilirsiniz.

CSS’te arkaplan rengi belirlemek için farklı formatlar kullanabilirsiniz. Hexadecimal renk kodları (#RRGGBB), RGB değerleri (rgb(r, g, b)) veya renk isimleri gibi farklı yöntemlerle arkaplan rengini tanımlayabilirsiniz. Örneğin, tablonun arkaplan rengini kırmızı yapmak için CSS kodunu şu şekilde kullanabilirsiniz:

table {  background-color: red;}

Tablonun arkaplan rengini belirlerken, metnin okunabilirliğini sağlamak için kontrastı göz önünde bulundurmanız önemlidir. Aşırı parlak veya açık arkaplan renkleri, metnin zor okunmasına neden olabilir. Bu nedenle, arkaplan rengini seçerken dikkatli olmalı ve metnin rahatlıkla okunabileceği bir renk tonu seçmelisiniz.

background-color

=Tablonun arkaplan rengini belirlemek için CSS’te background-color özelliği kullanılır. Bu özellik, tablonun arkaplan rengini istediğiniz renge ayarlayabilmenizi sağlar. Örneğin, tablonun arkaplan rengini pembe yapmak isterseniz, background-color: pink; şeklinde CSS kodunu tablo etiketine eklemeniz yeterlidir.

Ayrıca, background-color özelliği ile saydamlık da belirlenebilir. Saydamlık, tablonun arkaplanının ne kadar görünür olacağını kontrol etmenize olanak sağlar. Örneğin, tablonun arkaplanının yarı saydam olmasını isterseniz, background-color: rgba(255, 0, 0, 0.5); şeklinde CSS kodunu kullanabilirsiniz. Burada, rgba değerlerindeki son değer (0.5) saydamlığı temsil eder ve 0 ile 1 arasında bir değer alabilir.

Bu özellik ayrıca tablonun yanı sıra hücrelere de uygulanabilir. Örneğin, sadece bir hücreye arkaplan renği eklemek isterseniz, o hücrenin CSS kodunu ayrı olarak belirleyebilirsiniz. background-color özelliği sayesinde tabloya veya hücrelere görsel bir vurgu ekleyerek, içeriklerin daha çekici ve okunaklı olmasını sağlayabilirsiniz.özelliği kullanılır.

Tablonun arkaplan rengini belirlemek için CSS’te background-color özelliği kullanılır. Bu özellik, tablonun arkaplanına istediğiniz herhangi bir renk vermenizi sağlar. Örneğin, tabloya beyaz bir arkaplan rengi vermek için aşağıdaki CSS kodunu kullanabilirsiniz:

    table {        background-color: white;    }

Ayrıca, background-color özelliğini kullanarak tabloya istediğiniz herhangi bir renk kodu da verebilirsiniz. Örneğin, tabloya mavi bir arkaplan rengi vermek için aşağıdaki CSS kodunu kullanabilirsiniz:

    table {        background-color: #0000FF;    }

Tablonun arkaplan rengini belirlerken, renk seçimine dikkat etmek önemlidir. Kontrastı yüksek ve okunabilir bir arkaplan rengi seçmek, tablonun kullanıcılar tarafından daha kolay anlaşılmasını sağlar. Ayrıca, arkaplan rengini belirlerken tablonun içerisindeki verilerin öne çıkmasını sağlayacak bir renk seçimi yapmak da önemlidir.

Metin Formatı

=Tablodaki metnin rengi, boyutu, yazı tipi vb. özellikleri CSS ile belirlenebilir.

HTML tabloları sadece verileri düzenlemekle kalmaz, aynı zamanda metin formatını da özelleştirmenize olanak tanır. Bir tablodaki metni renklendirmek, boyutunu değiştirmek veya farklı bir yazı tipiyle vurgulamak isterseniz, CSS kullanabilirsiniz.

Öncelikle, metnin rengini belirlemek için color özelliğini kullanabilirsiniz. Örneğin, tablodaki metni kırmızı yapmak isterseniz, CSS kodunu aşağıdaki gibi kullanabilirsiniz:

        table {        color: red;    }    

Ayrıca, metnin boyutunu belirlemek için font-size özelliğini kullanabilirsiniz. Örneğin, tablodaki metni 14 piksel boyutunda yapmak isterseniz, aşağıdaki CSS kodunu kullanabilirsiniz:

        table {        font-size: 14px;    }    

Yazı tipini değiştirmek için ise font-family özelliğini kullanabilirsiniz. Örneğin, tablodaki metnin “Arial” yazı tipinde görünmesini isterseniz, aşağıdaki CSS kodunu kullanabilirsiniz:

        table {        font-family: Arial, sans-serif;    }    

Tabloda bulunan metinleri bu şekilde CSS ile özelleştirebilirsiniz. CSS’nin sunduğu diğer özellikleri kullanarak metinleri italik yapabilir, altı çizilebilir veya dikkat çekici farklı stiller yaratabilirsiniz. HTML tablo örneklerini kişiselleştirmek için CSS kullanmak, sayfanızın görünümünü geliştirmenin harika bir yoludur.

HTML Tablo Site Örnekleri

Bu makalede, HTML tablo örnekleri ve nasıl kullanılacağı konuları ele alınmaktadır.

Tablo Nedir?

HTML tabloları, verileri tablo formatında düzenlemek için kullanılan bir HTML elemanıdır.

Tabloların Yapısı

Tablolar,

etiketi ile başlar ve

etiketi ile biter. İçerisinde

(satır) ve

(hücre) etiketleri kullanılır.

Satır ve Hücreler

etiketleri ile tablonun satırları oluşturulur. Her satırda

etiketleri ile hücreler belirtilir.

Hücre İçeriği

Hücrelerin içine metin veya diğer HTML etiketleri yerleştirilebilir.

Hücre Genişliği ve Yüksekliği

Hücre genişliği ve yüksekliği CSS ile belirlenebilir veya HTML’de width ve height öznitelikleri kullanılabilir.

Başlık ve Alt Başlık

etiketi ile tablonun başlık ve alt başlık hücreleri oluşturulabilir.

Tabloları Biçimlendirmek

CSS kullanarak tabloları biçimlendirebilirsiniz. Örneğin, kenarlık, arkaplan rengi ve metin formatı gibi özellikler ekleyebilirsiniz.

Kenarlık Eklemek

Tabloya kenarlık eklemek için CSS’te border özelliği kullanılır.

Arkaplan Rengi

Tablonun arkaplan rengini belirlemek için CSS’te background-color özelliği kullanılır.

Metin Formatı

Tablodaki metnin rengi, boyutu, yazı tipi vb. özellikleri CSS ile belirlenebilir.

İlgili Yazılar

Bir yanıt yazın

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