HTML-tabeller är lätta att skapa när du förstår grunderna i rader och kolumner, och även när du förstår när det är bra att använda ett bord och när du ska undvika dem.
En kort historia av tabeller och webbdesign
För många år sedan använde webbdesigners HTML innan de accepterades av CSS och webbstandarder
element för att skapa en sidlayout för webbplatser. Webbplatsdesign skulle vara "skivad" i små bitar som ett pussel och sedan kombinerat med ett HTML-bord för att göra i webbläsaren som avsedd. Det var en väldigt komplex process som skapade massor av extra HTML-markup och som aldrig skulle kunna användas idag i den skärmvärld som våra webbplatser bor i. Eftersom CSS blev den accepterade metoden för webbsidor och layout, blev användningen av tabeller för detta shunned och många webbdesigners trodde felaktigt att "tabeller var dåliga". Det var och är osannat. Tabeller för layout är dåliga, men de har fortfarande en plats i webbdesign och HTML, nämligen att visa tabelldata som en kalender eller ett tågschema. För det innehållet är det fortfarande ett godtagbart och bra sätt att använda ett bord.
Så hur layoutar du ett bord? Låt oss börja med att skapa ett helt enkelt 2x2 bord. Detta kommer att ha 2 kolumner (det här är de vertikala blocken) och 2 rader (de horisontella blocken). När du har byggt ett 2x2-bord kan du bygga alla storlekar du vill ha genom att lägga till ytterligare rader eller kolumner.
Här är hur
-
Öppna först bordet
-
Öppna första raden med tr-taggen
-
Öppna den första kolumnen med td-taggen
|
-
Skriv innehållet i cellen
-
Stäng den första cellen och öppna den andra
|
-
Skriv innehållet i den andra cellen
-
Stäng den andra cellen och stäng raden
-
Skriv den andra raden exakt som den första
| |
-
Stäng sedan bordet
-
Det är allt!
Du kan också välja att lägga till tabellhuvud i ditt bord med hjälp av
element. Dessa tabellhuvuden skulle ersätta "tabelldata" -bitarna i den första tabellraden, så här:
namn | Roll | Jeremy | Designer | Jennifer | Utvecklare |
När den här sidan skulle visas i webbläsaren, skulle den första raden med tabellrubrikerna som standard visas i fetstil och de skulle centreras i tabellcellen som de visas i.
Så, är det bra att använda tabeller i HTML?
Ja, så länge du inte använder dem för layoutändamål, är det bra att använda tabeller. Om du behöver visa tabellinformation är en tabell vägen att göra det. Att undvika ett bord på grund av någon missvisad renhet för att undvika detta legitima HTML-element är faktiskt lika bakåt som att använda dem för layout skäl i denna dag och ålder.
Skriven av Jennifer Kyrin. Redigerad av Jeremy Girard.
|