Az előző leckében átvettük a táblázat alapvető tulajdonságait. Mielőtt belefognánk az ígért glitteres modulkeret készítésébe, még egy dolgot megmutatok. A táblázat "háttere" nemcsak adott szín lehet (bgcolor="#000000"), hanem kép is.

A kép megválasztásánál itt is ügyelni kell arra, hogy mozaikszerűen fogja kitölteni a táblázatot. Úgyanúgy, ahogy az 1. leckében leírtam az oldalháttérnél. Tehát érdemes viszonylag kicsi és homogén, textúra-szerű képet választani. A választott képet másold abba a könyvtárba, ahol majd a leendő HTML oldalad lesz, vagy megadhatod egy előzőleg már feltöltött kép URL-jét  is (http://....)

Az általam választott kép ez lesz:     a kép neve: fond0021.gif

Pötyögd be az alábbi utasítást a Jegyzettömbbe (a kép neve helyére a sajátodat írd):

Nekem így néz ki:

Jól látszik, hogy a választott kép mozaikszerűen kitölti a rendelkezésére álló 400 pixel széles, 4 üres sort ("Shift+Enter"-t) tartalmazó táblázatot. Nincs szegély, cellaköz, cellamargó, mindhárom érték nulla. A background="...kép neve vagy URL-je...." paraméterrel valósítottuk meg.

Tipp: ha egy táblázat sorában vagy oszlopában "helyet", üres sort akarsz létrehozni, akkor a megfelelő helyre szúrd be a "<br>"-t. A gportal szerkesztőjében ezt a "kódot" a Shift+Enter billentyűk egyidejű lenyomása hozza létre. (Lásd a "Hogyan" menü " "Túl nagy sortávolság" c. cikket)

Ha nem akarod lementeni a művedet, csak ki akarod próbálni, pötyögd be ide a kódot (csak akkor fogod látni a képet, ha URL-t adsz meg, azaz előtte feltöltöd valahová a képedet!)

Sikerült, ugye? Mert csak akkor mehetünk tovább!

Glitteres modulkeret készítése egymásba ágyazott táblázatok segítségével

Papírból hogyan készítenél keretet? Kivágsz egy téglalapot mondjuk arany színű kartonból, és egy kisebbet fehérből. A nagy közepére ragasztod a kicsit és máris kész egy fehér kép, arany kerettel. Itt is ugyanezt fogjuk tenni.

Kívülről haladunk befelé. Először azt a táblázatot hozzuk létre, amelynek a háttárszine (háttérképe - pl. glitter) a majdani keret lesz. Az előző leckéből már tudjuk, hogy a keret "vastagságát" a cellaköz tulajdonság (cellspacing) fogja meghatározni. Emlékszel, ez az az érték, amitől a táblázatban lévő tartalom nem "ragad rá" a szegélyre. Háttérképnek pedig (background) kiválasztunk egy glitteres képet. Nekem a cellaköz 4 pixeles lesz. Íme a kód (az URL helyére a sajátodat írd!):

Így néz ki:

 
Csupa csili-vili, nem is látszik a cellaköz:)) Pedig máris kész az arany keret!

Most nyiss egy üres Jegyzettömböt és abban hozzuk létre a majdani modulhátteret. Újabb táblázatot készítünk, amelynek a háttérkép (background) tulajdonságát adjuk meg. Íme:

Így néz ki:

 
Kész is van a "fehér papírtéglalap". Nincs más dolgunk, mint a fehér téglalpot "ráragasztani" az arany téglalapra, azaz egymásba ágyazzuk a táblázatokat.

Ennek menete a következő és most nagyon figyelj!

1. A második (fehér) táblázatot tartalmazó kódot másoljuk a vágólapra. Jelöld ki az egészet és másolás (Ctrl+C)
2. Nyisd meg az arany hátterű táblázatot tartalmazó jegyzettömböt és klikkelj a megfelelő helyre. (Szóköz - sárgával jelölt rész -után közvetlenül!)
3. Most jön a bemásolás : Ctrl+V (Kékkel jelöltem a bemásolt részt)
4. Töröld a szóközt ( sárgával jelölt rész) az arany hátterű táblázatból.
5. Kész is vagyunk! Az egész kódot bemásolod a gportalon egy egyszerű modulba "Forráskód" ill. "<>" nézetben, majd visszaváltasz és már látod is a gyönyörű modulkeretedet!
Ebbe aztán jöhetnek a képek, szövegek, linkek, bármi, amit szeretnél:)))

Nekem ilyen lett:

Feladat: Készíts modulkeretet egymásba ágyazott táblázatokkal. Dupla kerete legyen. A külső keret szélessége 6, a belsőé 3 pixel legyen. A két keret közötti távolság 15 pixel. (Vigyázz! Ez 4 db táblázat egymásba ágyazását jelenti, kívülről haladj befelé!!!)

Az enyém ilyen lett:

És a kód:

Ha ezt jól megérted és gyakorlod, bármilyen keretet tudsz majd csinálni:))

Jó szerkesztést és szórakozást!

 Egy klikkelés és már nyomatódik az oldal