Bir tabloyu görsel olarak oluşturun, temiz HTML alın. Yapıyı soldan yapılandırın (satırlar, sütunlar, üst bilgi, başlık, kenarlıklar, renkler, hizalama), doğrudan ızgaraya yazın ya da TSV / CSV / Excel verisi yapıştırın. HTML gerçek zamanlı üretilir ve hem kod olarak hem de korumalı canlı bir önizleme olarak gösterilir. Klasik çıktı (kenarlık / cellpadding öznitelikleri) ya da Modern çıktı (satır içi CSS) seçin, sonra kodu kopyalayın ya da kendi kendine yeten bir .html dosyası indirin. Her şey yerel çalışır — hiçbir şey yüklenmez.
Boyutlar
Yapı
Boyut & Kenarlıklar
Görünüm
Çıktı
Sekme/yeni satırla ayrılmış veri (Excel ya da TSV) ya da virgülle ayrılmış veri (tırnaklı CSV desteklenir) yapıştırın.
Hücreler5 × 5Bir satır/sütun kenarındaki küçük × işaretine tıklayarak kaldırın
HTML'yi oluşturmak için hücrelere yazın ya da Oluştur'a basın.
HTML Kodu
Önizleme
korumalı - betikler devre dışı
İpuçları: hücre içeriği varsayılan olarak HTML-kaçışlanır; böylece <script> tarzı girdi, üretilen kodu ya da önizlemeyi bozamaz. "Hücre HTML'sini kaçışla" seçeneğinin işaretini yalnızca bilerek işaretleme enjekte etmek istediğinizde kaldırın. Excel satırlarını TSV olarak yapıştırın ("Veri içe aktarın..." düğmesi sekmeleri ya da virgülleri otomatik algılar). Izgara en fazla 100 satır × 30 sütun destekler ve önizleme iframe'i korumalıdır (betik yok).
Bir anlamı olan tablolar
<th scope="col"> ve scope="row", ekran okuyucularına her üst bilginin neyi tanımladığını söyler; bir <caption> tüm tabloyu adlandırır. colspan ve rowspan, gerçekten birleştirilmiş veri için hücreleri birleştirir, ama görsel yerleşim için kullanıldıklarında ayrıştırıcıları şaşırtır.
Veri ilişkileri için tablo, yerleşim için CSS grid ya da flexbox kullanın — yerleşim tabloları hem erişilebilirliğe hem de duyarlılığa zarar verir.