-
Tablo Satırına Alt Kenarlık Nasıl Eklenir? - Border-bottom öğesini Tablo Satırı
Öğesi olarak ayarla - Stil Tablosu Elemanı
- Stil 'td' Elemanı
- Stil “tr” Elemanı
Tablo Satırına Alt Kenarlık Nasıl Eklenir? Tablo satırına alt kenarlık eklemek, daha iyi bir görsel deneyim sağlamak ve kullanıcının dikkatini çekmek için tüm satıra kenarlık ekler.
tablo satırına border-bottom eklemenin ayrıntılı bir örneği aşağıda gösterilmiştir:
Border-bottom öğesini Tablo Satırına ayarla
HTML dosyamızda
, ve elemanları kullanılarak yapılmış 3 satır ve 3 sütun içeren basit bir tablo oluşturun:
< masa >
< tr sınıf = 'sıra' >
< inci > İsim < / inci >
< inci > Durum < / inci >
< inci > Oda numarası < / inci >
< / tr >
< tr sınıf = 'sıra' >
< td > fakhar < / td >
< td > Öğrenci < / td >
< td > 05 < / td >
< / tr >
< tr sınıf = 'sıra' >
< td > Ömer < / td >
< td > Öğrenci < / td >
< td > 05 < / td >
< / tr >
< / masa >Yukarıdaki kod parçacığında, CSS'de daha sonra erişilebilmesi için
tablo satırlarına bir 'satır' sınıfı atadık.
Web sayfası şöyle görünecek:
Stil Tablosu Elemanı
CSS bölümünde tablo öğesini seçin ve metni ortaya hizalayın. Bundan sonra, “ sınır çöküşü değerini daraltmak için ayarlamak için ” özelliği:
masa
{
sınır daraltma: daraltma;
metin hizalama: merkez;
}Stil 'td' Elemanı
Daha iyi bir görsel temsil için, “
” tablo verisi ve “ ” tablo başlığı öğelerine 20px dolgusu verelim: td
{
dolgu: 20 piksel;
}
inci
{
dolgu: 20 piksel;
}Çıktı şöyle görünür:
Yukarıdaki çıktı, 20 piksel dolguyu gösterdi ve metni merkeze hizaladı.
Stil “tr” Elemanı
CSS dosyasında, 'tr' seçicinin altına border-bottom özelliğini ekleyin. Başlık satırı da dahil olmak üzere tablonun her satırına atar. Örneğin, değerini 2px katı koyu camgöbeği olarak ayarlayın:
tr {
alt kenarlık: 2 piksel katı koyu camgöbeği;
}Yukarıdaki kod parçacığını çalıştırdıktan sonra, web sayfası şöyle görünür:
Bu, her tablo satırının altına bir kenarlığın nasıl ekleneceği ile ilgili '
”. Çözüm
öğesinin altına bir kenarlık eklemek için, border-collapse CSS özelliğini daraltmaya ayarlayın ve “ ” öğesinde border-bottom özelliğini kullanın. CSS özelliğinin tabloya kenarlıklar uygulamasına izin verir. Bu şekilde her “
” etiketine kolayca kenarlık ekleyebilirsiniz. - Border-bottom öğesini Tablo Satırı