Sablon kódok
Ezt a listát még régebben szedtem össze nektek, a gportálos kódokat tartalmazza, egy kis segítséggel, hogy mi mire hat. Időközben persze bővült a gportál újabb kódokkal, úgyhogy ha lesz rá időm, frissítem is, egyenlőre addig is itt van a lista:
Alapvető kódok
body, div.pagewrapper - Az egész oldalra vonatkozó kódok. (pl. háttér)
table.site - Az oldal tartalmi része, itt adhatod meg pl. az oldalad szélességét.
table.headerbg - A fejléc háttere.
td.header - Fejléc
table.sitemain - Középső, tartalmi rész
td.sitecol - Oldalsáv
2016.05.15. 18:01, nikkii |
CSS tipp: Oldalsávok egymás mellett
Sajnos az utóbbi két hétben nem nagyon tudtam az oldallal foglalkozni, mivel rengeteg zh volt, nagyon sokat kellett tanulnom. Kedden kezdődik a vizsgaidőszak, és két vizsgám már lesz is a héten, úgyhogy sok frissítés továbbra sem lesz, de ha végre lement ez az egész, akkor belehúzok :)
Most egy kis trükköt hoztam, amivel a két oldalsáv egymás mellé helyezhető. Ez igazából egyszerű css kóddal megoldható, csak float-ot kell beállítani a hasáboknak.
.sitemain .sitecol:first-child, .sitecol:nth-child(3){
float: left;
}
.sitemain .sitecol:nth-child(2){
float: right;
}
Ez a két oldalsávot balra, míg a középsőmodult jobbra állítja. Természetesen az értékek felcserélhetők.
2016.05.14. 23:03, nikkii |
Live CSS váltó
Most egy olyan kódot hoztam nektek, amellyel egy 'CSS váltót' készíthettek. CSS kódokkal foglalkozó oldalakra szuper, hiszen enélkül nem nézhető át a teljes oldal élőben, hogy hogy is fog kinézni. Igy viszont nem kell többé próbamodulokkal, esetleg próbaoldalakkal küzedeni, egyetlen kattintásra megváltoztatható az oldal kinézete.
Aki ki szeretné próbálni, az itt megteheti: CSS váltó demó (A példa css kódokért köszönet Efruse-nak)
A kód a bővebben rész után található.
2016.03.28. 15:20, nikkii |
|