CSS Tablolar
CSS Aşağıdaki gibi tablolarınızda farklı renk ve tasarımlar kullanmanıza olanak sağlar:
Tablolarla ilgili bilmeniz gereken komutlar:
NOT: Tablolarda nesneler hücrelerde yer alır. HTML'de hücreler TD elementi ile belirtilir. Dolayısıyla aşağıda anlatılan kodların çoğu TD elementine yöneliktir.
İlgili sayfada bilgi aldıktan sonra tarayıcınızın GERİ butonu ile tekrar bu sayfaya gelerek derse devam edebilirsiniz.
Yukarıdaki örnekte hucre1 adlı hücre 100 piksel genişlik ve 200 piksel yüksekliğe sahipken, hucre2 400 piksel genişlik ve 100 piksel yüksekliğe sahiptir.
padding: Tablo içinden belirtilen değerde boşluk verdirir.
background-color: Arkaplan rengini belirtir.
color: Yazı rengini belirtir.
Dil | Neden Lazım? |
HTML | Temel web sayfası yapım bilgisi |
CSS | Siteyi görselleştirme |
PHP, ASP | İşlevsel siteler yapmak |
MySQL | Verileri yönetmek |
Tablolarla ilgili bilmeniz gereken komutlar:
NOT: Tablolarda nesneler hücrelerde yer alır. HTML'de hücreler TD elementi ile belirtilir. Dolayısıyla aşağıda anlatılan kodların çoğu TD elementine yöneliktir.
border: Kenarlık
Bu konu hakkında detaylı bilgi almak için buraya tıklayın.İlgili sayfada bilgi aldıktan sonra tarayıcınızın GERİ butonu ile tekrar bu sayfaya gelerek derse devam edebilirsiniz.
border-collapse: Kenarlıkları Kaldır
Tablo özelliği olarak bunu belirtirsek tablonun varsayılan kenarlıkları görülmeyecektir.table.tablom { border-collapse: collapse; }
width/height: Tablo Genişliği ve Yüksekliği
Tablo ve tablo hücreleri için genişlik (width) ve yükseklik (height) belirtmemizi sağlar.td.hucre1 { width: 100px; height: 200px; } td.hucre2 { width: 400px; height: 100px; }
Yukarıdaki örnekte hucre1 adlı hücre 100 piksel genişlik ve 200 piksel yüksekliğe sahipken, hucre2 400 piksel genişlik ve 100 piksel yüksekliğe sahiptir.
Diğer Tablo Şekillendirme Komutları
text-align: Tablo içindeki yazıların hizasını belirlersiniz.padding: Tablo içinden belirtilen değerde boşluk verdirir.
background-color: Arkaplan rengini belirtir.
color: Yazı rengini belirtir.