Tablolar HTML5'te nasıl oluşturulur - mankenler

Bazen web sayfanız bir tabloda en iyi veriyi içerir. Bu örnektekine benzer tabloları oluşturmak için HTML5'in tam özellikli tablo sistemini kullanabilirsiniz:

HTML formatındaki bir tablonun temel yapısı anlaşılması oldukça kolaydır; örnekte tablo oluşturan kodu kontrol edin:

basicTable. html tablo, td, th {kenar: 1 piksüz siyah};

Bir Temel Tablo

HTML Superheroes


 Kahraman 
 Güç 
 Nemesis 


 XMLator 
 Standartlara uygunluk 
 Eğimli Kod Boy 


 Kaptan CSS 
 Süper Yerleşim > Lord Deprecated 
 Tarayıcı Kadın 


 Megacompatibility 
 Çirkin Kod Monster 
 Kodu incelemek, bir tablonun dikkatle iç içe geçmiş etiketlerden oluşan bir grup olduğuna işaret eder. Bir masa inşa etme süreci zor değildir, ancak önceden düşünülmesi gerekiyor. 

Tablonuzu kaç sütun istediğinizi ve hangi satırların veya sütunların başlık olacağını bildirecek şekilde planlayın.

1. Masanızın kağıda ilk önce çizilmesi iyi bir fikirdir, özellikle de karmaşıksa.

   Masaya

2. etiketi ile başlayın.

   çifti, tüm tabloyu kapsar.

3. çifti bulunan bir tablo satırı oluşturun.

   Tablo sadece bir dizi satırdır. Her bir veri satırını çevrelemek için

   çifti gerekir.

4. ile başlıklar belirtin. Genellikle, üst sıra (ve belki de en soldaki sütun) başlık içerir. Başlık hücresi olarak ele alınması gereken metni belirtmek için

   çifti kullanın. Varsayılan olarak, bu tür hücreler genellikle daha kalın ve ortalanmış, ancak CSS ile değiştirilebilir. Sıradan veri hücrelerini

5. çifti ile belirtin. Satır boyunca hücre sayısını tutarlı tutun.

6. HTML5 tablolarını daha iyi tanıdıkça, bir hücrenin birden fazla satır veya sütunda uzatılmasının yollarını bulabilirsiniz.

   Gerektiğinde CSS ekleyin.

7. Tabloların CSS ile değiştirebileceğiniz basit bir biçimi var - örneğin kenarlıklar eklemek için.

   HTML5 kullanıcıları tabloları mizanp amaçları için kullanmanın yollarını geliştirmiş olsa da, CSS, ihtiyacınız olan tüm sayfa yerleşimi tekniklerini sağlar; bu nedenle, HTML5 tablolarını amaçlanan amaçları için kullanın: sekmeli veriler sunun.