Ako som tvoril layout..?:))

Napsal O webu (») 24. 3. 2005 v kategorii Grafika, CSS, přečteno: 2816×
Ako som tvoril layout..?:))

Asi hodinu som sa pozeral na obrázok, čo si mi Radovan (admin) poslal a analyzoval som, čo ako urobím. Zistil som, že bude treba hlavičku, 4 nejaké stĺpčeky a pätičku. Otvoril som si PSPad, vytvoril si index.php a nastav.css. Do indexu som samozrejme naincludoval to, čo bude treba a vytvoril si príslušné súbory s xhtml kódom pre dané div-y. Podstatnejší ale bol css súbor. Začal som pekne od nuly, na prázdnom "papieri". V Adobe Photoshop som si otvoril obrázok, čo si mi poslal(viď odkaz vyššie) a nastavil farby, ktoré budem potrebovať. Išiel som od hora smerom dole. Hlavičku nebol problém vytvoriť, asi najľahšie;))

Pätička nasledovala potom. Ťažším orieškom ale bolo horné a dolné menu, aby vyzeralo identicky v Internet Explorer, Firefox a Opera. Po asi troch dňoch sa mi to konečne podarilo:) Menu(robené ako zoznam) vyzeralo k svetu, nech si sa pozrel odkiaľkoľvek(IE, FF, O). Ľavé menu. Jednoduchá záležitosť. Zoznam, kde som si nadefinoval pár farieb, odkazov a nebol problém, aby išlo rovnako pod spomínanými prehliadačmi.

No a dostávam sa k tej najzložitejšej časti celého layoutu, ktorý mi ukradol dosť času, preto to trvalo aj značne dlho. A síce je tým všetko ostatné. Druhý stĺpec problémom nebol, kedže sa stačilo pohrať s margin-om;) Ale tak jednoduché to nebolo. Pretože nastúpili posledné dva stĺpce. Ten, kde sú diskusie a ten, kde je vedúcim členom anketa. Neustále sa mi stávalo, že tieto dva stĺpce(div-y) sa mi zobrazovali vždy až pomyslene pod druhý stĺpec zľava(výpis článkov). Najprv som skúsil pozicovať absolútne, lenže IE neposlúchal, preto som miestami nevedel nájsť tú správnu cestu. Potom mi ale svitlo a všetko išlo tak, ako ide;)) A síce, druhý stĺpec má nastavenie float:left, štvrtý stĺpec má float:right no a stĺpec, kde sú diskusie elegantne padol medzi ne bez toho, aby bolo potrebné extra nastavenie.

Potom to trebalo už len doladiť, myslím detaily, ale to je triviálna záležitosť;) Takže asi toľko k tvorbe layout-u ako takého. Len tak pre zaujímavosť, daný css súbor má niečo okolo 800 riadkov;)

pjotr
Autor: Pjotr

Facebook Twitter Topčlánky.cz Linkuj.cz

Komentáře

Zobrazit: standardní | od aktivních | poslední příspěvky | všechno
Článek ještě nebyl okomentován.


Nový komentář

Téma:
Jméno:
Notif. e-mail *:
Komentář:
  [b] [obr]
Odpovězte prosím číslicemi: Součet čísel sedm a jedenáct