Az alap GPortal kódok2015.04.10. 07:26, Enma22
Ezek lesznek átalakítva
Itt most ömlesztve találod meg azokat a CSS kódokat, melyeket majd egyenként fogunk átalakítani.
Hozzáadunk ezt-azt, minden le lesz majd írva.
Képeffektek 2.2015.04.29. 11:34, Enma22
Ezt muszáj ketté szednem
Ide azon "effektek" kerülnek, melyek igazából csak formázások, de jól mutatnak egy-egy képnél.
Ilyen ugye a lekerekített kép, keretes kép, összemegy vagy nagyobb lesz a kép, és az áttetsző kép is ilyen. Talán arról még nem írtam.
Az alap kép marad a baba megint.
Képeffektek2015.04.29. 10:47, Enma22
A képeknek adhatunk a szokásos effekteken kívül (áttetszőség, keret, méret) egyéb dizájnokat is. Ezeket alkalmazhatjuk önmagukban, vagy egy hover (ráviszem az egeret) effekttel kombinálva. Akár a linkelt képeken is lehet alkalmazni.
De általában minden képre hatnak, ha nincsen külön besorolásuk (class).
Egy-egy szövegrész átalakítása2015.04.21. 14:19, Enma22
Lásd a menümet
Ez a kód, amit leírok most, majd később több helyen is alkalmazható lesz, most csak a szöveghez írom le, amihez példát is találtok majd, az ugyanis nem a linkhez kötődik, hanem külön van átalakítva.
Ehhez a kódhoz a KÓDNÉZETET kell majd alkalmazni!
Először megírjátok a szöveget, amit szeretnétek, meg is lehet formázni, és egy elküld gomb után átválthattok kódnézetbe. Ha előtte váltatok át, akkor a szöveg törlődik. Vagy másik megoldás a Forráskód. Én azért nem szeretem, mert plusz sorokat szokott betenni az átváltásoknál.
Csoportosítás2015.04.20. 16:34, Enma22
Vagyis az egyes kódrészek kicsit összeszedve
Ebben a cikkben összeszedem nektek a kódrészeket, melyeket eddig használtunk az egyes részek átalakításához, hogy kicsit átláthatóbb legyen a dolog.
Mivel most az összes kód a fejlécek részben található, így ezt a cikket majd kiemelem a menübe, így mindig elérhető lesz, ha csak egy-egy részt szeretnétek megnézni.
A keretek, vagyis a border az megvan külön cikkben, ezeket is ugye hozzá lehet adni egy-egy részhez.
Bővebben link kinézete2015.04.17. 11:54, Enma22
Ez az alap kód:
.blogmorelink {
}
.blogmorelink a:link {
}
.blogmorelink a:hover {
}
Ebbe tudunk egyéb dolgot is beletenni, példa rá a Bővebben alatt.
Kisebb szövegrészek2015.04.14. 16:18, Enma22
.txt kódok
Az alap kódok ezek:
.txtnormal { /* általános szöveg, pl. hírek */
font-size: 11px;
font-weight: none;}
.txtbold { /* blog címe blog pluszban, hírek bevezetője */
font-size: 11px;
font-weight: bold}
.txtmini { /* dátum, szerző blog pluszban*/
font-size: 10px;
font-weight: none}
Mindegyik több szövegre is hat az oldalon!
Gombok, egyebek2015.04.13. 16:06, Enma22
Az alap kód ez:
input, button, select, textarea { /* gombok, egyéb */
border: #686868 1px solid;
font-weight: normal;
font-size: 10px;
color: black;
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color: #f0f0f0
}
A számlálóban hat, valamint a bejelentkezésnél, a textarea az a rész, ahová írod a címeket, kódnézetben a kódot. Nekem, mivel nem vettem külön-külön ezeket a kódokat, most mind lila.
Linkek2015.04.13. 11:41, Enma22
Finoman kell bánni az effektekkel
Alap kódok:
a:link, a:visited, a.menu:link, a.menu:visited { /* linkek */
font-size: 8pt;
color: #000099;
text-decoration: none
}
a:hover, a.menu:hover, a.menu:active { /* link ha ráviszem az egeret, aktív link */
font-size: 8pt;
color: #6699ff;
text-decoration: underline
}
a.menu az a menüre vonatkozik, ha van ilyen modulod, de ha már egyedi akarsz lenni, akkor gondolom nincsen. Mindegy, bajt nem csinálsz vele, ha otthagyod.
Blog Plusz fejlécek2015.04.12. 09:49, Enma22
Friss bejegyzés alakítása
Az alap kód ez lenne:
td.listheader { /* blog plusz */
font-size: 8pt;
font-weight: bold;
color: #f0f0f0;
background-color: #686868
}
Ez a Blog Pluszban található fejléceket alakítja át, így a Friss bejegyzések, Friss hozzászólások és az Archívum részt. Valamint hatással van hozzászólás írásnál is az ott lévő fejlécekre, pl. a Még nincs hozzászólás részre.
|