Helló kedves blogolvasók! Gyakran a weboldalakon a szöveg és a képek mellett szükségessé válik különféle adatok megjelenítése táblázatok formájában. Ez érthető, egy táblázat a legkényelmesebb módszer nagy mennyiségű információ bemutatására. Ezért felmerül a kérdés "Hogyan illeszthet be táblázatokat a html-be?"... Ebben a cikkben megválaszolom ezt a kérdést, és számos példát adok a különböző html táblákra.
Táblázat létrehozása HTML használatával
A HTML táblákat négy lépésben hozzák létre.
1. A html-kód első lépésében használja a párost címke
mondja el a böngészőnek, hogy táblázat került beillesztésre a weboldalra: ... A tábla elem egy weboldal blokkszintű eleme. Ezért a tábla mindig egy új vonalon jelenik meg, függőlegesen behúzva a szomszédos elemektől, így nincs szükség egy bekezdésbe helyezni.
2. A második lépésben alkotunk húrok táblázatokat párosított címkék elhelyezésével
belül ... Minden elem külön sort hoz létre:
3. Továbbá, a harmadik lépésben alkotunk sejt táblák párosított címkékkel
és |
amelyek beleférnek az elembe |
... Címke | teremt a szokásos cella, és | sejt cím, azaz a megfelelő oszlop fejléce:
4. Nos, az utolsó lépésben az elemek belsejébe helyezzük | és |
a cellák tartalma. A táblázat weblapra történő beszúrására szolgáló HTML-kód a következőképpen néz ki:
1. oszlop | 2. oszlop | 3. oszlop |
|---|
Cell 1-1 | 1-2. Cella | 1–3. Sejt |
Cell 2-1 | 2-2. Cella | 2-3. Cella |
A határok megjelenítésének finomhangolása segít. A gombbal megváltoztathatja a keretek vastagságát és színét, valamint a szegélyek típusát.
A cellákba helyezendő szöveg nem kötelező, de ha a szöveg nagy, akkor a címke alkalmazásával szakaszokra bontható
Ha valamilyen módon díszítenie kell a beillesztett szöveget, használhatja.
A szöveg mellett képeket helyezhetünk el a cellákban a címke használatával ![]()
:
 |
Egy másik táblázat akár cellatartalomként is működhet. Ebben az esetben a beágyazott tábla létrehozása nem különbözik a szokásos tábla létrehozásától. Csak a címkék között
és | címkék kerülnek beillesztésre , és sorok és cellák kerülnek beillesztésre.
A táblázatok létrehozásakor néhány szabályt figyelembe kell venni:
- csak a címkét használják a tábla létrehozásához
;
- címke
csak egy címkén belül lehet ;
- címkék
| és | csak egy címkén belül lehet | , bármely más címke tartalma
a böngésző figyelmen kívül hagyja;
- a táblázat tartalma (szöveg vagy kép) csak címkékben lehet
| és | ;
- a táblázat celláinak legalább valamilyen tartalommal kell rendelkezniük, különben előfordulhat, hogy a böngésző egyáltalán nem jeleníti meg őket, de ha valamelyik cellának üresnek kell lennie, akkor általában egy nem törő helyet (HTML literal) helyeznek el benne;
- a táblázat a weboldal blokkelemeire utal;
- a táblázat és celláinak méretei a tartalomtól függenek, azaz az asztal szélességben és magasságban van kifeszítve, hogy minden beleférjen;
- egy kis behúzás készül az egyes cellák határai és az egyes cellák határai és azok tartalma között;
- a fejléc celláiban (th elem) a szöveg félkövéren és középen jelenik meg;
- határok az asztal körül, és cellái alapértelmezés szerint nem rajzolódnak.
Táblázat fejléc
Kezdjük egy párosított címkével ,
amely a táblának címet ad. A cím szövege ebbe a címkébe kerül, és ennek a címkén belül kell lennie ... És nem mindegy, hogy a címke hol helyezkedik el a táblázat html-kódjában , a böngésző továbbra is megjeleníti a címet a táblázat felett, és a közepéhez igazítja. De általában a tag közvetlenül a nyitó címke után helyezzük el :
Ez egy asztal
1.1. Cella | 1.2. Cella |
2.1. Cella | 2.2. Cella |
Kijelző:
Táblázat szakaszok
A html tábla logikusan felosztható részekre - szakaszokra. Összesen háromféle szakasz létezik:
- fejléc szakasz, amelybe a fejléc cellák kerülnek, amelyek a táblázat fejlécét alkotják;
- testrész, amelyben az alapadatokkal rendelkező cellák találhatók;
- befejezési szakasz, amelybe az összesített cellákat helyezzük.
A táblázat fejléc szakasza egy pár címke segítségével jön létre ... Ezenkívül megengedett egynél több elem használata. egy táblázatban, és a html kódba kell mennie közvetlenül a címke után .
A törzs szakasz párosított címkével jön létre ... Egy html tábla több törzsszakaszt tartalmazhat, amely lehetővé teszi olyan szerkezeti blokkok létrehozását, amelyekre egységes tervezési stílusok alkalmazhatók.
A kitöltési részt egy párosított címke alkotja és egy konténeren belül csak egy maradhat.
Mindezeknek a párosított címkéknek címkéket kell tartalmazniuk amelyek a megfelelő szakaszokhoz kapcsolódó vonalakat alkotnak:
1. oszlop | 2. oszlop | 3. oszlop |
1.1. Cella | 1.2. Cella | 1.3. Cella |
2.1. Cella | 2.2. Cella | 2.3. Cella |
1. eredmény | 2. eredmény | 3. eredmény |
Összekapcsolja a táblázat celláit
Továbbra is beszélni kell a táblázatok legfontosabb jellemzőiről - sejtek kombinálása.Az attribútumok arra szolgálnak, hogy több cellát egyesítsenek egybe colspan és sortávolság címkék és | ... A colspan attribútum határozza meg a vízszintesen egyesített cellák számát, a sorok pedig függőlegesen:
1.1 | 1.2-1.3 |
2.1 | 2.2 | 2.3 |
3.1-4.1 | 3.2 | 3.3 |
4.2 | 4.3 |
Példa eredményre:
| 1.1
|
1.2-1.3
|
| 2.1
|
2.2
|
2.3
|
| 3.1-4.1
|
3.2
|
3.3
|
| 4.2
|
4.3
|
A cellák összefűzésénél fontos ellenőrizni az egyes sorok celláinak számát, hogy ne legyenek hibák. Szóval, az építkezés | két cellát helyettesít, ezért a következő sorban két címkének kell lennie | , vagy ugyanaz a konstrukció! Ha az összes sorban lévő cellák száma nem egyezik, akkor üres extra cellák jelennek meg.
Példa a rossz HTML kódra cellák egyesítésekor:
cella 1.1 | cella 1.2 |
cella 2.1 | cella 2.2 |
És a megjelenítés eredménye a böngészőben:
Azok. Ha elemzi a html kódot, akkor észreveszi, hogy az első sor három cellát tartalmaz, amelyek közül kettő a colspan attribútummal van kombinálva, a második sor pedig csak két cellát tartalmaz. Ezért a harmadik üres cella megjelenik a második sorban.
Címkeattribútumok
Ebben a bejegyzésben már találkoztunk a címke egyik attribútumával ... Egy szegély attribútummal, amely pixelben állítja be a szegély szélességét. Alapértelmezés szerint ez 0, ezért a cellák alapértelmezés szerint határok nélkül jelennek meg.
A border attribútum mellett számos más fontos attribútum is van, amelyet a címke támogat. ... Vessünk egy pillantást rájuk.
Tulajdonság igazítsa- készletek igazítástáblázatok oldalanként. Balra, középre, jobbra veheti az értékeket, amelyek beállítják a balra, középre és jobbra az igazítást. Az alapértelmezett bal.
Tulajdonság háttér, amely a beállítja a háttérképetaz asztalhoz. A képpel ellátott fájl címét értéknek vesszük.
bgcolor - készletek háttérszín táblázatok. A háttér attribútummal együtt használható.
Tulajdonság bordercolor- kérdezi keret színe táblázatok.
Cellpadding - meghatározza a sejthatár és annak tartalma közötti távolság... Javítja a táblázat olvashatóságát. Az érték tetszőleges pozitív szám lehet.
Cellatér - készletek a sejtek külső határai közötti távolság.
Erről a beszélgetésről táblázat beillesztése a html oldalba Befejezem, csak összefoglalva:
- a címkéket egy táblázat beszúrására használják
- asztal megnevezése, - hozzáad egy sort és - cella behelyezése;
- a táblázat egy weboldal blokkeleme;
- a cellák tartalma nemcsak szöveg lehet, hanem képek és egyéb táblázatok is;
- a táblázat háromféle szakaszot tartalmazhat: fejléc szakasz - , befejezési szakasz és testrész - ;
- cellák kombinálásához használja a tag attribútumokat
| colspan és sortávolság.
Ennyi, a következő bejegyzésben a html webhely navigációs eszközeiről fogok beszélni. Annak érdekében, hogy ne hagyja ki ezt a bejegyzést, iratkozzon fel a blog frissítéseire! Mindent, hamarosan találkozunk!
A HTML-táblák a legerősebb és leggyakrabban használt eszköz. Alapvetően a webmesterek a táblázatokat nemcsak módszerként használják az adatmegjelenítés csoportosítására, hanem a weboldalak formázására is.
Vizsgáljuk meg a HTML táblák használatának mindkét módját. Először azonban megtanuljuk, hogyan kell táblázatokat hozzáadni egy HTML-dokumentumhoz, és megvizsgáljuk azokat a lehetőségeket, amelyeket a HTML nyújt számunkra a táblákkal való munkához.
Egyszerű HTML tábla létrehozása
Minden HTML-tábla sok cellából áll, amelyek sorokba vannak rendezve. És ezek a sorok már egy teljes táblázatot alkotnak. Párosított címke segítségével jelöljük ki a táblázatot .
Mint már tudja, a táblák sorokból és cellákból állnak. A legegyszerűbb táblázat elkészítéséhez pedig még két címke kell: ezek párosított címkék | és amelyeket karakterláncok és párosított címkék létrehozására használnak, és | sejtek létrehozásáért felelős. ( Sőt, hiányozhatnak a vonalak és cellák záró címkéi)
Tehát, mivel már tudjuk, hogyan lehet létrehozni egy alapvető HTML táblázatot, alkalmazzuk a fenti információkat, és hozzunk létre egy egyszerű táblázatot, amint az látható (1.ábra).
A legegyszerűbb táblázat 1. ábra
A legegyszerűbb táblázat kódjaamely az 1. ábrán látható (fent)
1-táblázat cella |
2-asztal cellája |
3 asztalos cella |
4 cellás asztal |
5 asztalos cella |
6 asztalos cella |
7 asztalos cella |
8 asztalos cella |
9 asztalos cella |
10 asztalos cella |
11 asztalos cella |
12 asztalos cella |
Összetett táblázatkód, példa a 2. ábrára
Oszlopattribútum kombinálása " colspan" |
Karakterláncok összefűzése attribútum " sortávolság" |
Tulajdonság " uralkodó"" top "
|
Tulajdonság " uralkodó" "alsó" |
Az eredményül kapott táblázat 1. kép
... csúnyán néz ki. Mindez azért van, mert a legegyszerűbb tábla létrehozásához használt címkék ( , , | ) különféle attribútumokkal rendelkezhet, amelyeket meg kell adni: lehetnek hátterek, szegélyek, dimenziók stb.
Most nézzük meg a címkére vonatkozó attribútumokat ... Annak érdekében, hogy lássa, hogyan fog változni a táblázat a címkére való alkalmazással attribútumokat, másolja át a táblázat kódját, és helyezze egy .html kiterjesztésű szöveges dokumentumba, és nyissa meg egy böngészőben, hozzáadva az attribútumokat a táblázat kódjához és frissítve az oldalt, meglátja, hogyan fog kinézni a táblázata a böngészőben.
Címkeattribútumok:
1) A "határ" attribútum, az egész tábla szegélyének szélességét pixelben állítja be, az alábbiak szerint: .
2) A "szélesség" és a "magasság" attribútumok - ez az attribútum állítja be az asztal ajánlott szélességét és magasságát, az alábbiak szerint:
3) A "bordercolor" attribútum - a teljes tábla szegélyének színét állítja be, az alábbiak szerint: .
4) Az "align" attribútum - tábla igazítása, igazítás \u003d bal - a táblázat balra, igazítás \u003d jobbra - jobbra lesz igazítva, így írva:
5) "bgcolor" attribútum - a táblázat háttérszínét állítja be, az alábbiak szerint:
Szerintem az attribútumok elegendőek számodra!
Most nézzük meg a címke attribútumait: és |
Címkeattribútumok |
1) Tag attribútum "magasság". Ne feledje, hogy a címke a címke óta nincs "width" attribútum felelős a vonalért, és ennek megfelelően a magasságért. És az oszlopok már felelősek a szélességért. Bár a címkének van a "height" attribútum, de szinte soha nem használják sehol.
Címkeattribútumok
2) Tag attribútum | "szélesség", a címke "magasság" (magasság) attribútuma | nem, a címke óta | felelős a táblázat celláért és szélességéért, a sor pedig a magasságért (tag | ).
3) Tag attribútum "colspan". Az attribútum értéke azt az oszlopok számát jelenti, amelyeket ez a cella elfoglal. Más szavakkal, ez az attribútum lehetővé teszi, hogy több szomszédos cellát függőlegesen egyesítsen egybe.
4) Tag attribútum | "sorfutás". Az attribútum értéke azt a sorszámot jelenti, amelyet ez a cella elfoglal. Ennek megfelelően ez az attribútum lehetővé teszi több cella vízszintes összekapcsolását.
5) Címke attribútum | "igazítsa". Ez az attribútum lehetővé teszi az elemek vízszintes igazítását egy cellán belül. Három értéke van: "bal" (a cellától balra), "center" (középre), "jobb" (a cellától jobbra). Ha semmi nincs megadva, akkor az igazítás megmarad.
6) Címke attribútum | "valign". Ez az attribútum lehetővé teszi az elemek függőleges igazítását egy cellán belül. Az "igazítás" mellett csak három értéke van: "felső" (felső), "középső" (középső), "alsó" (alsó). Az alapértelmezett középen "közép".
Alkalmazzuk az eddig tanultakat.
A 2. ábra mutatja a komplex táblázatunkat.
Komplex asztal 2. ábra
Alapvetően ennyit kell tudni a HTML táblákról, és sikeresen használni őket.
HTML-tábla létrehozása a Joomla szerkesztőben.
Táblázat létrehozásához a Joomla-ban alapértelmezés szerint használhatja a Joomla-ban található TinyMce szerkesztőt.
Most a Jоmla vizuális szerkesztő használatával egyszerű vagy összetett táblázatváltozatokat hozhat létre, de vigyázzon, ne felejtse el a webhely tartalmi területének szélességét, hogy egy tábla létrehozásakor a szélessége ne haladja meg ezt az értéket.
Fájlok letöltése:
HTML videó tanfolyam, Evgeny Popov
Az ingyenes videotanfolyam 33 HTML órát tartalmaz.
A videotanfolyam feltárja a HTML alapismereteit, és hasznos lesz a kezdő webhelyépítők számára, akik még nem ismerik a HTML-t, hanem a tapasztaltabb webmesterek számára is.
Szegélyezett asztal
| Név |
Vezetéknév |
| Larissa |
Isaeva |
| Dmitriy |
Kolesznyikov |
EREDMÉNY:
Szegély nélküli asztal
Szegélyezett asztal
Címkeattribútumok | és | sejtek egyesítésére
Példa
|
görények |
| súly |
a méret |
| hímek |
1,2 - 2,5 kg |
70 cm-ig |
| nőstények |
0,7 - 1,0 kg |
40 cm-ig |
EREDMÉNY:
|
|
görények |
| súly |
a méret |
| hímek |
1,2 - 2,5 kg |
70 cm-ig |
| nőstények |
0,7 - 1,0 kg |
40 cm-ig |
A HTML5 szabvány szerint minden korábban használt táblaattribútum, mint pl határ, cellatávolság, cellpadding mások pedig már nem támogatottak, és használatukat az érvényesítő hibának tartja a kódban. A táblák megtervezéséhez CSS stílusokat kell használnia, amelyekkel minden elavult tábla attribútumot lecserélhet. Például az attribútum helyett cellatávolság a táblázat cellák közötti távolság megváltoztatásához használja a tulajdonságot határok közötti távolság, és a táblázat cellákban lévő tartalom összehangolásához - tulajdonságok szöveg igazítás és függőleges-aling... CSS stílusok az asztaldíszhez
HTML táblázatsor csoportosító címkék
Összetettebb táblák létrehozásához használhatja a címkéket:
Példa
Sörfogyasztás
| TELJES NÉV. |
liter |
| Teljes |
250 |
| Ivanov Ivan Ivanovich |
133 |
| Petrov Petr Petrovich |
117 |
EREDMÉNY:
HTML táblázatoszlop-csoportosító címkék
Címkék attribútum és
A legegyszerűbben a Sudoku tábla példájával értheti meg, hogyan használható a sorok és oszlopok csoportosítása.
A col címke minden oszlophoz külön állítja be a paramétereket. Nem számít, hogyan írod be a forráskódot:
vagy
Példa
EREDMÉNY:
Ne próbálj stílusozni szöveg igazítás a címkékhez és ... A címkék közé helyezett szöveg ... | , nem örökli ezt a stílust, mert a címke nem egy címke leszármazottja , nincs címke .
Stílus megadásával megváltoztathatja a szöveg vízszintes igazítását a táblázat adott oszlopában szöveg igazítás álosztályra td: n -edik gyermek (n) , ahol n az oszlop száma. Ez a módszer azonban nem fog működni, ha az attribútum szerepel a táblázat celláiban. colspan.
Példa
| Név |
Ár, dörzsölje.) |
| Perces fizetés szoláriumért (4 perctől) | 15 |
| 50 perc szolárium (14 rubel / perc, 1 hónap) | 700 |
| 100 perc szolárium (13 rubel / perc, 2 hónap) | 1300 |
| 200 perc szolárium (12 rubel / perc, 3 hónap) | 2400 |
EREDMÉNY:
Ez a módszer azonban nem fog működni, ha az attribútum szerepel a táblázat celláiban. colspan.
A táblák sokoldalúsága, a megjelenésüket vezérlő nagyszámú paraméter miatt a táblák már régóta határozott szabványsá váltak a weboldalak elrendezésében. A láthatatlan szegéllyel rendelkező asztal olyan, mint egy moduláris rács, mely blokkokban kényelmes elhelyezni egy weboldal elemeit. Ez azonban nem egészen helyes megközelítés, mert minden HTML-objektumot saját céljaira definiálnak, és ha helytelenül használják, ráadásul ez azt is jelenti, hogy nincsenek alternatívák. Ez sokáig így volt, míg a rétegek nem helyettesítették a táblákat a webhely elrendezésében. Ez nem azt jelenti, hogy a rétegeket mostanában folyamatosan használják, de a tendencia már egyértelműen körvonalazódott - táblázatok táblázatos adatok elhelyezésére szolgálnak, a rétegek pedig - az elrendezésre és a tervezésre.
Táblázat készítése
A táblázat sorokból és cellák oszlopaiból áll, amelyek szöveget és képeket tartalmazhatnak. Általában táblákat használnak az adatok rendszerezésére és bemutatására, de a táblák nem korlátozódnak erre. A táblázatok segítségével kényelmes az oldal elrendezésének szedése a szöveg és a kép töredékeinek a kívánt módon történő elrendezésével.
Táblázat hozzáadásához egy weboldalhoz használja a címkét ... Ez az elem a táblázat tartalmát meghatározó elemek tárolójaként szolgál. Bármelyik tábla sorokból és cellákból áll, amelyek ennek megfelelően vannak beállítva címkékkel és | ... A táblázatnak tartalmaznia kell legalább egy cellát (12.1. Példa). Címke helyett megengedett | címke használata | ... Címkével díszített cellában lévő szöveg | , amelyet a böngésző félkövéren és a cella közepéhez igazítva jelenít meg. Egyébként a címkéken keresztül létrehozott cellák közötti különbségek | és | nem.
12.1. Példa Táblázat készítése
TABLE tag
| 1. cella |
2. cella |
| 3. cella |
4. cella |
A sejtek sorrendjét és megjelenését a 2. ábra mutatja. 12.1. az asztal teste. A törzs sorokból és oszlopokból áll. A táblázatot soronként töltjük ki.
Minden címke | új sort hoz létre. Tovább beágyazva oszlopok jönnek létre. Több oszlop is létrehozható. Ebben az esetben figyelnie kell az egyes sorok oszlopainak számát. Például, ha az első sornak 5 oszlopa volt, akkor a következő soroknak 5 oszloppal kellett rendelkezniük. Ellenkező esetben az asztal lebeg. Lehetséges sejtek kombinálása.
Hogyan készítsünk táblázatot html-ben
Adjunk egy példát, html kód:
| Példa táblázat |
| 1. oszlop |
2. oszlop |
Ügyeljen a cellára | ... A cellák vízszintes kombinálásához a speciális colspan attribútumot használjuk. Numerikus értéke az egyesítendő oszlopok számát jelzi. Ennek az attribútumnak is van egy analógja: tag | (táblafejléc), ahol colspan-t is kell írni. Az eredmény ugyanaz lesz. De gyakran használják a szokásos td-t.
Most nézzük meg közelebbről a címke összes attribútumát.
.
Címkeattribútumok és tulajdonságok
A nyitó címkéhez különféle attribútumok írhatók.
1. Tulajdonság align \u003d "paraméter" - beállítja a táblázat igazítását. A következő értékeket veheti fel:
A fenti példában igazítottuk a táblázatot a középre align \u003d "center".
Ez az attribútum nemcsak egy táblára, hanem az egyes tábla cellákra is alkalmazható. vagy húrok | ... Így az igazítás különböző lesz a különböző cellákban.
például
| ... |
| ... |
...
2. Tulajdonság háttér \u003d "URL" - beállítja a háttérképet. Az URL helyett a háttérkép címét kell megírni.
Példa
| Példa táblázat |
| 1. oszlop |
2. oszlop |
Az oldalon az alábbiakká alakítva:
A fenti példában háttérképünk az img mappában található (amely ugyanabban a könyvtárban található, mint a html oldal), a képet pedig fon.gif néven hívják. Figyelje meg, hogy hozzáadtuk a style \u003d "color: white;" ... Mivel a háttér szinte fekete, így a szöveg nem olvad össze a háttérrel, fehérre tettük a szöveget.
3. Tulajdonság bgcolor \u003d "color" - beállítja a táblázat háttérszínét. Színként kiválaszthatja a teljes paletta bármelyikét (lásd a HTML-színek kódjait és neveit)
4. Tulajdonság határ \u003d "szám" - meghatározza az asztal szegélyének vastagságát. Az előző példákban megadtuk a border \u003d "1" értéket, ami azt jelenti, hogy a szegély szélessége 1 pixel.
5. Tulajdonság bordercolor \u003d "color" - beállítja a szegély színét. Ha a határ \u003d "0", akkor nem lesz határ, és a szegély színének nincs értelme.
6. Tulajdonság cellpadding \u003d "szám" - kitöltés a kerettől a cellatartalomig pixelben.
7. Tulajdonság cellspacing \u003d "szám" - a cellák közötti távolság pixelben.
8. Tulajdonság cols \u003d "szám" - az oszlopok száma. Ha nem adja meg, a böngésző maga határozza meg az oszlopok számát. Az egyetlen különbség az, hogy ennek a paraméternek a megadása valószínűleg felgyorsítja a táblázat betöltését.
9. Tulajdonságkeret \u003d "paraméter" - az asztal körüli szegélyek megjelenítése. A következő értékeket veheti fel:
- érvénytelen - ne húzzon határokat
- határ - az asztal körüli határ
- felett - határ a táblázat tetején
- lent - határ az asztal alján
- hsides - csak vízszintes szegélyeket adjon hozzá (a táblázat felső és alsó része)
- vsides - csak függőleges határokat rajzol (az asztal bal és jobb oldalán)
- rhs - szegély csak az asztal jobb oldalán
- lhs - csak az asztal bal oldalán szegélyez
10. Tulajdonság magassága \u003d "szám" - beállítja a táblázat magasságát: pixelben vagy százalékban.
11. Tulajdonságszabályok \u003d "paraméter" - hol jelenítse meg a cellák közötti határokat. A következő értékeket veheti fel:
- all - egy vonal húzódik az egyes táblázatcellák köré
- csoportok - a vonal a címkék által létrehozott csoportok között jelenik meg , , ,
vagy
- cols - a vonal az oszlopok között jelenik meg
- nincs - minden határ el van rejtve
- sorok - a határ a címkén keresztül létrehozott táblázatsorok között húzódik
12. Tulajdonságszélesség \u003d "szám" - beállítja a táblázat szélességét: pixelben vagy százalékban.
13. Tulajdonságosztály \u003d "osztálynév" - megadhatja annak az osztálynak a nevét, amelyhez a tábla tartozik.
14. Tulajdonságstílus \u003d "stílusok" - a stílusokat minden táblához külön-külön lehet beállítani.
Itt az ideje, hogy belemerüljön a táblázatba, és megnézze a táblázat celláinak attribútumait. Ezeket az attribútumokat be kell írni a nyitó címkébe
.
Attribútumok és tulajdonságok és |
1. Tulajdonság align \u003d "paraméter" - beállítja az egyes táblák celláinak igazítását. A következő értékeket veheti fel:
- bal - bal igazítás
- közép - közép igazítás
- jobb - jobb igazítás
2. Tulajdonság háttér \u003d "URL" - beállítja a cella háttérképét. Az URL helyett a háttérkép címét kell megírni.
3. Tulajdonság bgcolor \u003d "color" - a cella háttérszínét állítja be.
4. Tulajdonság bordercolor \u003d "color" - a cella határának színét állítja be.
5. Tulajdonság char \u003d "levél" - beállítja azt a betűt, amelyből az igazítást el kell végezni. Az align attribútum értékét char-ra kell állítani.
6. Tulajdonság colspan \u003d "szám" - megadja az egyesített vízszintes cellák számát.
7. Tulajdonság magassága \u003d "szám" - beállítja a táblázat magasságát: pixelben vagy százalékban.
8. Tulajdonságszélesség \u003d "szám" - beállítja a táblázat szélességét: pixelben vagy százalékban%.
9. Tulajdonság rowspan \u003d "szám" - az egyesített függőleges cellák számát állítja be.
10. Tulajdonság valign \u003d "paraméter" - a cellatartalom függőleges igazítása.
- top - a cella tartalmát a vonal tetejéhez igazítja
- közép - közép igazítás
- alsó - igazítsa az aljára
- alapvonal - alapvonal igazítás
1. megjegyzés Címkéhez | ugyanazok a lehetőségek állnak rendelkezésre, mint a | ... Paraméterek egy címkéhez | hierarchikusan alkalmazandó lesz mindenki számára benne
Hogyan lehet megakadályozni az asztal celláinak összetapadását
Abban az esetben, ha a szegélyt (cellák határát) és a cellák közötti nulla kitöltést használjuk, akkor is össze vannak ragasztva, és kettős szegélyt kapunk. Ennek elkerülése érdekében regisztrálnia kell a border-collapse: collapse táblázatot a stíluslapon:
...
Kedves olvasó, most sokkal többet tanult a html tábla címkéről. Most azt tanácsolom, hogy folytassa a következő leckével.
| |
|
| | | | | |
| |
