Az adattáblák oszlopokba és sorokba sorolják a különféle információkat az egyszerű olvasás érdekében. Az adatok általában részben numerikusak, szöveges címkékkel. Példa erre egy adattábla, amely megmutatja, hogy valaki mennyi kalóriát fogyaszt naponta. Az adattáblák online elkészítése HTML vagy a bonyolultabb CSS böngésző nyelvével történhet. A végső táblázat pontosan úgy néz ki, mint egy táblázatban vagy papíron létrehozott adattábla. Az egyetlen különbség a háttérkódolás, amely csak akkor látható, ha a forráskódot nézzük. A kódolást HTML-szerkesztők, szöveg vagy egyéb módon hozhatják létre. Számos olyan webhely található online, amely lehetővé teszi adatok bevitelét, néhány attribútum beállítását és az összes táblakód létrehozását az Ön számára. Az online adattáblákat általában egy weboldal részeként használják. Az adattáblákat gyakran használják kategóriákkal rendelkező cikkek, például eladó cikkek listájának létrehozására. Egyes weboldalak statisztikai adatok megjelenítésére használják őket. Míg az adattáblák offline is használhatók nyomtatáshoz vagy jelentésekben, általában jobb használni táblázatkezelő szoftverek, például a Microsoft Office Excel, amelyek sokkal több funkciót kínálnak a munkavégzéshez adatokkal. Ez az útmutató bemutatja, hogyan lehet HTML-adattáblát létrehozni a Jegyzettömbbel.
HTML kód megadásához nyisson meg egy HTML-szerkesztőt vagy csak egy közönséges Jegyzettömb szöveges dokumentumot. A Jegyzettömb jól működik, ha megszokta a HTML kódolást. A HTML-szerkesztők gyorsabbá teszik az ismétlődő feladatokat, de egyesek, például a Frontpage, felesleges, felesleges kódolást adnak, amely lelassíthatja a weboldalakat. A legjobb dolog, ha először kódolsz egy HTML-szerkesztővel, majd visszalépsz és kézzel szerkeszted a kódot a megtisztítás érdekében.
Döntse el a táblázat, a szegély, a szélesség, a háttérszín és a betűtípus színeinek attribútumait. A táblázat könnyen olvashatóvá tételéhez figyelembe kell vennie a weboldal elrendezését, szélességét, színeit és egyéb jellemzőit. Azt is el kell döntenie, hogy hány sorra és oszlopra van szükség az adatokhoz. Kezdje el meghatározni a táblázat attribútumait. (Példánk bemutatja az ebéden és a vacsoránál elfogyasztott kalóriák számát minden hétköznapon. Három oszlopra van szükségünk (Nap, Ebéd és Vacsora) és hét sorra (kettő a címkékre és egy minden hétköznapra).
Adjon hozzá szegélyt a táblázat és az adatcellák köré. A szegélyek az adatokat cellákra osztják az egyszerű megtekintés érdekében. Képpontokban mérhető, és 0 értéket kaphat, ha nem használja őket. Az egy vagy két képpontos szegély általában rendben van. A határ címkéje
bgcolor = border = "CHOSEN_BORDER_WIDTH"
A szegély színe a címkével megváltoztatható
bordercolor = "CHOSEN_COLOR"
amely az alapszín kifejezéseket használja, például vörös vagy fekete vagy hatjegyű hexadecimális színkódokat. A hexadecimálisok több színt kínálnak. Példánk a border = "2" és a bordercolor = "black" kifejezéseket használja.
Határozza meg az egész táblázat szélességét. Mérjük pixelben vagy a képernyő méretének százalékában. A képpontok véglegesek, és a százalékok lehetővé teszik, hogy a táblázat a különböző képernyőméretekhez igazodjon. Próbálja meg megítélni a szélességet a sorok közötti adatok szélessége alapján. Ha később megtudja, hogy az asztal túl vékony vagy széles, akkor megváltoztatható. Példánk a width = "175" értéket használja.
Állítsa be az adatcellák háttérszínét. Ez eltér az oldal háttérszínétől, amely jó kontrasztot kínál. A címke az
bgcolor = "CHOSEN_COLOR"
akárcsak a szegély színe. Példánk a bgcolor = "white" szót használja.
Állítsa be a cellák szövegének betűszínét. Győződjön meg arról, hogy a szín jól kontrasztos a háttérrel, így könnyen olvasható. A világos a sötétben vagy a sötét a világosban mindig a legjobban működik. A címke az
font = "CHOSEN_COLOR"
Példánk a font = "black", amely jól kontrasztos a fehér háttérrel.
Írja ki a teljes táblázat címkéket egy bal és jobb nyíl közé egy szóközzel a címkeattribútumok között, és az elején lévő táblázatcímkével kezdődik. A címkék sorrendje nem számít, amíg az "asztal" elöl van.
Határozza meg az oszlopszélességeket. Az egyes oszlopok szélessége az egész táblázat szélességétől függ. Vegye ki a táblázat szélességét és ossza el a cellák számával, hogy egyenletes méretű oszlopokat kapjon. Szükség esetén állítsa be az oszlopok szélességét, de a teljes összeg nem haladhatja meg az asztal szélességét. Amikor az egyik cella szélessége megváltozik, a többi cellát ki kell igazítani a táblázat teljes szélességéhez. (Példánk szélessége 175 és soronként három oszlop, tehát egyenletes felosztás kb. 59. A tényleges felosztás 70, 60, 40.)
Kezdje hozzá adatait. Először kezdjen el egy új sort, és adjon hozzá egy táblázatsort a kóddal
Adja meg a cella adatait; ezzel a kóddal üres cellákat ábrázol:
Zárja be a cellát a címkével. A bordercolor címke segítségével megadható a cellahatár színe, ha szükséges. Ha ez kimarad, akkor az alapértelmezett tábla bordercolort használja. Példánk első cellakódja:
Ismételje meg a táblázat adatcelláinak létrehozását, mindegyiket egy új sorban, amíg a sor összes cellája elkészül. Ezután fejezze be a sort a címkével. Kezdje a következő sort ugyanazzal a folyamattal, kezdve a
Zárja be a táblázat kódját a gombbal címke. Az utolsó táblázat kódja, ha két adatsor után ér véget, lent van.
Amire szükséged lesz
- HTML-szerkesztő vagy Jegyzettömb
- Adat