Tablo Genişliği Nasıl Ayarlanır

İçindekiler:

Tablo Genişliği Nasıl Ayarlanır
Tablo Genişliği Nasıl Ayarlanır

Video: Tablo Genişliği Nasıl Ayarlanır

Video: Tablo Genişliği Nasıl Ayarlanır
Video: 005 - Excel 2010 Satır Yüksekliği , Sütun Genişliği 2024, Mayıs
Anonim

Web sayfalarına yerleştirilen tabloları oluşturan Köprü Metni İşaretleme Dili (HTML) talimatları, oldukça fazla sayıda ek parametre sağlar. Bu, diğer blok öğelerinin aksine, boyutları yalnızca CSS dilini (Basamaklı Stil Sayfaları veya "Basamaklı Stil Sayfaları") kullanarak değil, aynı zamanda HTML'nin kendisini de kullanarak ayarlamanıza olanak tanır.

Tablo genişliği nasıl ayarlanır
Tablo genişliği nasıl ayarlanır

Talimatlar

Aşama 1

Tablonun genişliğini piksel cinsinden belirtmek için tablo etiketinin width niteliğini kullanın. Etiket (HTML talimatı) tablosu bir açılıştan (

) ve kapanış (

) aralarında tablonun satırlarını ve hücrelerini oluşturan etiketlerin bulunduğu bölümler. Ek parametreler (nitelikler) açılış etiketine yerleştirilebilir, bunların listesi her bir özel etiket için uluslararası standartlar tarafından belirlenir. Tablo etiketi için bu standartlar, tablonun piksel cinsinden genişliğini belirten genişlik özniteliğinin kullanımına izin verir. 500 piksellik bir genişlik tanımlayan böyle bir etikete sahip basit bir tablonun HTML kodu şöyle görünebilir:

1. hücre 2. hücre

Adım 2

Tablonun genişliğini piksel yerine yüzde olarak belirtmeniz gerekiyorsa, width özniteliğinin değerine bir % karakteri ekleyin:

1. hücre 2. hücre

Lütfen bu yüzdelerin mutlaka tarayıcı penceresinin genişliğine bağlı olmayacağını unutmayın. Belgenin yapısı burada önemlidir - tıpkı iç içe geçmiş bir oyuncak bebeğin iç içe geçtiğinden daha geniş olamayacağı gibi, tablonun genişliğinin %100'ü ana öğenin genişliğinden daha büyük olamaz. Örneğin tablo bir div bloğunun içindeyse bu bloğun genişliği %100 olarak alınacaktır.

Aşama 3

Kaynak kodunda tek bir yerde web sayfasındaki tablolar için aynı genişliği ayarlamak istiyorsanız, stil açıklama dili talimatlarını kullanın. Bunu yapmak için, ilk olarak HTML kodunun (ve arasında) head kısmına CSS dil ifadelerini sınırlayan açılış ve kapanış etiketlerini yerleştirin:

/ * CSS talimatları burada olacak * /

Ardından bu etiketlerin arasına aşağıdaki CSS'yi koyun: tablo {width: 100px;} Burada tablo, kaşlı ayraçlar içine yerleştirilen açıklamanın sayfa kodunda görünen tüm tablo etiketlerine uygulanması gerektiğini belirtir. Genişlik parametresi genişliği ayarlar. Burada da göreli genişliği yüzde olarak kullanabilirsiniz.

4. Adım

Genişliği tüm tablolar için değil, yalnızca bir veya birkaç tablo için belirtmeniz gerekiyorsa, sınıf adını CSS kodunda ve HTML tablo etiketinde belirtin. Örneğin, bir grup dar tabloyu işaretleyen sınıfın küçük olduğunu varsayalım. O zaman stilinin açıklaması şöyle görünebilir: table.tiny {width: 100px;} Ve HTML kodundaki tablolardan birinin karşılık gelen etiketi şu şekildedir:

1. hücre 2. hücre

Önerilen: