A táblák az egyik legfontosabb, de ugyanakkor összetett elemek, amelyeknek jelen kell lennie a weboldalakon. Segítségükkel célszerű a fontos és hasznos információkat meglehetősen tömör formában benyújtani. Természetesen a különféle motorokon futó sablonok legtöbb szerkesztője lehetővé teszi, hogy automatikusan helyezze el a táblázatot egy webhely oldalára vagy egy külön kiadványra, de mi van akkor, ha egy webes erőforrás tervezése, az oldalak létrehozása a semmiből történik? Ezután a varázsló előtt előfordulhat, hogy probléma van: hogyan készítsük el a táblázatot a HTML-ben. Lássuk, hogyan kell ezt az elemet helyesen és gyorsan létrehozni.
Válasszon szerkesztőt
Először is, amikor elkezdi létrehozni a táblázatot, meg kell határoznia azt a szerkesztőt, amelyen dolgozni fog. Természetesen a legegyszerűbb módja annak, hogy kiválassza a programot, amelyben létrehozza a webhely fő kódját. De a legjobb, ha egy régi jó noteszgépet használnak e célból.
Megkérdezheted, miért ne bonyolítsd az életedet, mert ha mindent egyszerre csinálsz a szerkesztőben, akkor láthatod az eredményt is, és a program utasításait is felhasználhatod.
Igen, ez igaz, de amikor létrehozunk egy táblát a semmiből, akkor nemcsak alaposan tanulmányozhatjuk létrehozásának alapelveit, hanem elkerülhetjük a fő kódban felmerülő hibás tévedéseket és hibákat. Néha előfordul, hogy a kurzor véletlenül lefelé mozog, és a kódírás folyamán a kód hibás, ami néha nehéz megtalálni. Amikor létrehoz egy táblázatot a Jegyzettömbben, akkor másolja a kódolást, és helyezze be a kívánt helyre.
Algoritmus egy táblázat létrehozásához
Először összeállítunk egy rövid algoritmust, hogyan készítsünk táblázatot a HTML-ben. Ez szükséges ahhoz, hogy megértse az egyes lépések sorrendjét. Ezután elemezzük, hogyan kell végrehajtani az egyes elemeket.
Kezdjük az előkészítő akciókkal.
1. Rajzolj egy táblázat diagramját egy papírlapra.
2. Sorolja fel a sorok és cellák számát. Ha az utolsó szám különbözik - külön-külön figyelembe vesszük az egyes sorokat.
3. Határozza meg a sorok fejlécében lévő cellák számát (például "Nem", "Név" stb.).
4. Feljegyezzük az asztal fő paramétereit - a színt, a magasságot és a szélességet, a szöveg igazítását - általánosságban, mindent, amire szüksége van.
Ezután lépjen közvetlenül egy táblázat létrehozásához:
1. Helyezze be a táblázat címkéit.
2. Helyezze be a sorok címkéit a szükséges összeg alapján.
3. A sorokban helyezze be a cellák címkéit (rendszeres és tőke), a papírra írt összeg alapján is.
4. Adja meg a táblázat egészének paramétereit.
5. Szükség esetén beállítjuk az egyes cellák mutatóit.
6. Töltsük fel celláinkat szöveggel.
Hozzon létre egy táblát
Tehát választottad a szerkesztőt, most kitaláljuk, hogyan hozzunk létre egy táblázatot a HTML-ben. Az a címke, amellyel az asztalt beillesztettük az oldal kódjába (
) egy pár, vagyis a tervezés ezzel a címkével kezdődik, és végül .
A táblázat címkéinek beillesztésével sorokat és cellákat hozunk létre.
Megjegyezzük egyszerre, hogy ezek az elemek is párosulnak. A
címke meghatározza a sorokat, és | a cellákat.
A fejléccellákhoz használja a | páros elemet.
Amint már említettük, először ki kell adni a sorokat, majd be kell regisztrálni a cellákat. Annak érdekében, hogy ne keveredjen össze, azt javasoljuk, hogy egy vagy két sorban bármelyik blokk között két betétet vagy egy új elemblokkot írjon be a "Tab" billentyű használatával.
Hogy néz ki? Körülbelül:
- ;
-
; -
No. п / п ; -
Vezetéknév ; - ;
-
; -
| 1 | ; -
Ivanov ; - ;
- .
Amint látja, ebben semmi sem bonyolult. A legfontosabb dolog az, hogy ne keveredj össze a sorok és a cellák számával. Ellenkező esetben a táblázat elhajolhat.
Megmagyaráztuk egy táblázat HTML-ben történő létrehozását, most már át tudunk lépni mind a mátrix, mind annak sorai és sejtjei paramétereire.
Táblázat opciók A kód megírása során figyelni kell a következő pontokra: a HTML táblázatban, a határszín, a háttér, a szöveg stb.
A táblázat paraméterei a címkében vannak megadva. Ezek a következők:
1. Határ - a határok szélessége. Ez egész számként szerepel. Alapértelmezés szerint bármelyik táblázat határa nulla.
2. Határszín - a határ színe. Megadható hexadecimális színkódként (# 00008B), névvel pedig angolul (DarkBlue). Alapértelmezés szerint mindig szürke.
3. Bgcolor - a háttérszín. A kód vagy név használatával is megadható.
4. Igazítás - a szöveg mögé helyezze be a szöveget. Az alapértelmezett marad. Ehhez a paraméterhez a következő lehetőségek állnak rendelkezésre:
- Balra a jobb oldalon lévő áramlás;
- Jobbra áramlik balra;
- Center - a tábla közepén jelenik meg áramlás nélkül.
5. A szélesség és a magasság - a táblázat szélessége és magassága. Ez megadható pixelben és százalékban is (a böngésző ablakméretéhez viszonyítva).
A jelzőt fel kell tüntetni, különös figyelmet kell fordítani a tervezésre. A paraméter megadása után az egyenlő jelet a megadott értéknek kell idézőjelben követnie.
Ami a szöveg színét illeti, ugyanúgy van tervezve, mint a szöveges szöveg HTML formátumban.
A táblázat egy példája:
-
; -
; -
No. п / п ; -
Vezetéknév ; - ;
-
; -
| 1 | ; -
Ivanov ; - ;
- .
Vonalparaméterek Tehát már rájöttünk, hogyan készíthetünk táblázatot a HTML-ben, és leírhatjuk az alapvető paramétereket. De mi van, ha ki kell választanunk egy sort? A tervezés nem olyan, mint a táblázat fő szövege?
A sztringparaméterek a | címkében ugyanúgy vannak írva, mint a táblázatadatok. A következő változók megadhatók egy karakterlánchoz:
1. Már ismert, hogy határokat, bordercolor és bgcolor.
2. Igazítás - a vonalhoz igazítsa a szöveget. Az értékek maradhatnak balra, középre és jobbra.
3. Valigálás - ez a címke függőlegesen igazítja a szöveget. A következő értékeket veszi figyelembe:
- Felső - a szöveg a felső határon igazodik;
- Középközpontú;
- Alsó - az alsó határon.
Példa a vonalra:
-
; -
No. п / п ; -
Vezetéknév ; - .
Cellabeállítások És az utolsó dolog, amit figyelmet kell szentelni azoknak, akik szeretnék tudni, hogyan lehet táblázatot készíteni a HTML-ben, az egyes cellák, mind a hagyományos, mind a fejléc paraméterei. Valójában mindent pontosan ugyanúgy végzünk, mint egy asztalhoz vagy egy sorhoz. Az egyetlen dolog, még két fontos elem:
1. Colspan - ez a paraméter azon oszlopok számát határozza meg, amelyek egy cellában megoszthatók.
2. Rowspan - meghatározza a sorok számát, amelyet ez a cell foglal magában.
Mivel a tervezés nem különbözik a vonal írásától, nem adunk példát a kódról.
megállapítások Egy asztal készítése nem olyan nehéz, mint első pillantásra. A legfontosabb dolog, amikor megírja a kódját - az ügyesség és a figyelem.
Ami azt illeti, hogyan helyezzünk el egy táblázatot a HTML-ben, a titkosítást pontosan az oldal helyére másoljuk és beillesztjük, amelyben véleményünk szerint megtalálható.
Ne féljen kísérletezni, és hamarosan elsajátíthatja a táblák készítésének technikáját. Sok szerencsét!
| |
| | |
| | | |
|