Veri tabloları, kolay okuma için çeşitli bilgileri sütunlarda ve satırlarda listeler. Veriler genellikle metin etiketleriyle kısmen sayısaldır. Bir örnek, birinin her gün kaç kalori yediğini gösteren bir veri tablosudur. Çevrimiçi bir veri tablosu yapmak, HTML veya daha karmaşık CSS tarayıcı dili ile yapılabilir. Nihai tablo, bir elektronik tabloda veya kağıt üzerinde oluşturulmuş bir veri tablosuna benziyor. Tek fark, kaynak koduna bakmadıkça görülmeyen arka plan kodlamasıdır. Kodlama, HTML editörleri, metin veya başka yollarla oluşturulabilir. Çevrimiçi olarak veri girme, birkaç öznitelik belirleme ve sizin için tüm tablo kodlamalarını oluşturma olanağı sunan birçok site var. Çevrimiçi veri tabloları genellikle bir Web sayfasının parçası olarak kullanılır. Veri tabloları genellikle, satılık ürünler gibi kategorilere sahip öğelerin listelerini oluşturmak için kullanılır. Bazı Web sayfaları, bilgi için istatistikleri göstermek için bunları kullanır. Veri tabloları yazdırmak için veya raporlarda çevrimdışı olarak kullanılabilirken, genellikle kullanmak daha iyidir. çalışmak için daha birçok özellik sunan Microsoft Office Excel gibi elektronik tablo yazılımı verilerle. Bu kılavuz, Not Defteri ile bir HTML veri tablosunun nasıl oluşturulacağını gösterir.
HTML kodunu girmek için bir HTML düzenleyicisi veya yalnızca sıradan bir Not Defteri metin belgesi açın. HTML kodlamasına alışkınsanız, not defteri iyi çalışır. HTML düzenleyicileri tekrarlanan görevleri daha hızlı hale getirir, ancak Frontpage gibi bazıları Web sayfalarını yavaşlatabilecek fazladan, gereksiz kodlama ekler. Yapılacak en iyi şey, önce bir HTML düzenleyicisi ile kodlamak, ardından geri dönüp, temizlemek için kodu elle düzenlemek.
Kenarlık, genişlik, arka plan rengi ve yazı tipi renkleri için tablo niteliklerine karar verin. Tabloyu kolayca okunabilir hale getirmek için Web sayfası düzenini, genişliğini, renklerini ve diğer nitelikleri dikkate almanız gerekir. Ayrıca, veriler için kaç satır ve sütun gerektiğine karar vermeniz gerekir. Tablo niteliklerini tanımlamaya başlayın. (Örneğimiz, hafta içi her gün öğle ve akşam yemeklerinde yenen kalori sayısını göstermektedir. Üç sütuna (Gün, Öğle ve Akşam Yemeği) ve yedi satıra (etiketler için iki ve haftanın her günü için bir tane) ihtiyacımız var.
Tablo ve veri hücrelerinin etrafına bir kenarlık ekleyin. Kenarlıklar, kolay görüntüleme için verileri hücrelere ayırır. Piksel cinsinden ölçülür ve kullanılmaması için 0 değeri verilebilir. Bir veya iki piksel kenarlık genellikle iyidir. Kenarlık için etiket
bgcolor=border="CHOSEN_BORDER_WIDTH"
Kenar rengi etiketi ile değiştirilebilir
bordercolor="CHOSEN_COLOR"
kırmızı veya siyah veya altı basamaklı onaltılık renk kodları gibi temel renk terimlerini kullanan. Onaltılık sayılar daha fazla renk sunar. Örneğimiz border="2" ve bordercolor="black" kullanıyor.
Tüm tablonun genişliğini belirleyin. Piksel veya ekran boyutunun yüzdesi olarak ölçülür. Pikseller kesindir ve yüzdeler tablonun farklı ekran boyutlarına ayarlanmasını sağlar. Satırlardaki verilerin genişliğine göre genişliği değerlendirmeye çalışın. Daha sonra masanın çok ince veya geniş olduğunu öğrenirseniz, masa değiştirilebilir. Örneğimiz width="175" kullanır.
Veri hücrelerinin arka plan rengini ayarlayın. İyi bir kontrast sunabilen sayfanın arka plan renginden farklıdır. etiket
bgcolor="CHOSEN_COLOR"
tıpkı bordür rengi gibi. Örneğimiz bgcolor="white" kullanıyor.
Hücrelerdeki metnin yazı tipi rengini ayarlayın. Kolayca okunabilmesi için rengin arka planla iyi bir kontrast oluşturduğundan emin olun. Karanlıkta ışık veya ışıkta karanlık her zaman en iyi sonucu verir. etiket
yazı tipi="CHOSEN_COLOR"
Örneğimiz, beyaz arka planla iyi bir tezat oluşturan font="black".
Tam tablo etiketlerini, sol ve sağ ok arasına, etiket özellikleri arasında boşluk bırakarak ve öndeki tablo etiketinden başlayarak yazın. "Tablo" önde olduğu sürece etiketlerin sırası önemli değildir.
Sütun genişliklerini belirleyin. Her sütunun genişliği, tüm tablonun genişliğine bağlıdır. Tablo genişliğini alın ve eşit boyutlu sütunlar elde etmek için hücre sayısına bölün. Gerekirse sütun genişliklerini ayarlayın, ancak toplam tablo genişliğini aşamaz. Bir hücre genişliği değiştiğinde, diğer hücrelerin tablo genişliğini toplayacak şekilde ayarlanması gerekir. (Örneğimiz 175 genişliğe ve satır başına üç sütuna sahiptir, bu nedenle yaklaşık 59'luk bir çift bölme vardır. Gerçek bölünme 70, 60, 40'tır.)
Verilerinizi eklemeye başlayın. İlk önce, yeni bir satıra başlayın ve kodla birlikte bir tablo satırı ekleyin
Hücre için verilerinizi girin; boş hücreleri temsil etmek için bu kodu kullanarak:
Etiketli hücreyi kapatın. bordercolor etiketi, istenirse hücre kenarlık rengini belirtmek için kullanılır. Dışarıda bırakılırsa, varsayılan tablo bordercolor kullanılır. Örneğimizin ilk hücre kodu:
Satırdaki tüm hücreler tamamlanana kadar her biri yeni bir satırda tablo veri hücreleri oluşturmayı tekrarlayın. Ardından satırı etiketiyle bitirin. ile başlayarak aynı işlemle bir sonraki satıra başlayın.
Tablo kodunu ile kapatın etiket. Son tablo kodumuz, iki satır veriden sonra sona erdiyse aşağıdadır.
İhtiyacınız Olan Şeyler
- HTML düzenleyicisi veya Not Defteri
- Veri