Sablon létrehozása joomla CSS és HTML

A cél a tankönyv - tanítani, hogyan kell építeni egy három oszlopos sablont.

Már találkozott a sablon szerkezetét, megtanulják felismerni, hogy milyen típusú minta, bontott alapvető parancs kimenetét tartalmat. De nem tettük a legfontosabb dolog - nem, hogy egy mintát. Ebben a cikkben, mi jön hozzunk létre egy sablon elrendezése, és megismerkedhetnek a létrehozását „gumi” sablont.

Szeretném tisztázni, hogy van két fajta sablonok - rögzített és gumi. „Rubber” minta fogják hívni egy sablont, amely automatikusan alkalmazkodik egy bizonyos szélessége a felhasználó böngészőjében. Egy ilyen elrendezés számos előnye van:

• Minden rendelkezésre álló teret böngésző
• Van egy „kis” monitor nem jelenik meg vízszintes görgető
• Tagjai „nagy” monitor lehet boldog, hogyan kell hatékonyan használni a teljes képernyőt, ami azt jelenti, hogy a pénzt a monitort is töltött :)
• Ezek a sablonok kényelmesen papírra nyomtatott bármilyen formátumú

A legtöbb tervezők, hogy hozzon létre egy gumi táblázatelrendezés, vagy más szóval, egy asztal vorstku sablont. Igen, persze, asztal vorstke sokkal könnyebb megtanulni, mint vorstke rétegeken, de véleményem szerint a táblázatok használata már említett hátrányok és adjunk hozzá:

• Amikor egy nagy fészkelő táblázatok nehéz megtalálni a megfelelő kódrészletet, és cserélje ki. Képzeld el, mennyi időt fordítanak a keresett két vagy három sor közül a végtelen asztal / tr / td!

És azt kell tisztázni egy dolgot: közben elrendezést használjuk stílusok (CSS), így ha már hallott a CSS először mielőtt ténylegesen egy sablon létrehozása, olvassa el a kézikönyvet „Lépésről lépésre” CSS. Ezért választottam ezt az útmutatót? Meg van írva az irodalmi, könnyen érthető nyelven, és fel van szerelve számos példát.

Ebben a példában az egyszerűség kedvéért, én határozza meg a stílust a dokumentum fejlécében, de megint csak az egyértelműség kedvéért. Később „kiolvasztott” minden stílust a dokumentum egy külön fájlban. Most megpróbálunk tanulni a kódot.

Tettem a sablon jelölő egy közös konténerben

, melyek egy előre meghatározott szélességű 80% -át a felhasználó a képernyő felbontását. Bal, középső és jobb oldali oszlop szélessége, amely százalékában határozzák meg. A szélessége minden oszlop számítva a szélessége a szülő konténer (). Minden oszlop paraméter alkalmazva float: left elhelyezésére a hangszórók vízszintesen. A „footer” sablont használtam világos ingatlan, egyrészt, ami azt jelzi, a végén a igazítás balra, és ennek eredményeként megkapjuk a „footer” alább mindhárom oszlopban.

Ahhoz, eleganciát mi sablon, valamint javítani a szöveg érthetőségét, az szükséges, hogy az elemek az egyes oszlopokban, hozzáadjuk a bemélyedés a határok az oszlopok magukat. Bárki habozzon használni a tulajdonságait a padding, de az Internet Explorer nem mindig értelmezi a stílusok, mi azt szeretnénk. Ezért böngészőtámogatások (támogatja a különböző böngészők) a mi sablon, azt az egyes oszlopok egy újabb réteget:

: