Egy kis segítség, hogy milyen css szelektorokat használjuk az oldal különböző elemeihez. Használatuk: szelektor (oldal elem) neve, majd kapcsos zárójelek közé írjuk, hogy milyen színű, hátterű legyen, stb.
szelektor_nev {
background: lightblue;
color:white;
}
body {
background: orange !important;
}
body kivétel, egyedül ennél kell használni háttérszín beállításánál az !important. Ezzel kényszerítjük rá a böngészőket, hogy ez a szín érvényesüljön.
Először jöjjön maga az oldal:
[IMG]http://i.imgur.com/zE20Goc.jpg[/IMG]
Amint az látszik:
body - Az oldal háttere hátterét ezzel változtathatjuk, de akkor az alapból középső fehér csík is eltűnik. [URL=http://sg.hu/forum/uzenet/1405410824/25]bővebben[/URL]
#menu-family - A fenti lapcsalád tagjait foglalja magába, színezhetjük, vagy akár el is tüntethetjük (#menu-family { display:none; })
#breadcumb - ezzel a kis navigáló menü és a Témaindító: xy megjelenését változtathatjuk
#comments-login: ezzel pedig a képen is nyilazott bejelentkezve szöveget
#post-submit: Ha nem tetszik a jelenlegi Küldés gomb kinézete, fogjuk ezt a css szelektort, és a kapcsos zárójelek közé írjunk neki olyan színt, méretet, stb ami nekünk tetszik.
Végül de nem utolsó sorban:
#topic-information: Ez foglalja magába a bannert. Képen van egy kis kerete, ezt így értem el:
#topic-information {
border:1px solid #000;
}
Ha csak a bannerban lévő linkek kinézetét szeretnénk megváltoztatni, akkor csináljuk ezt:
#topic-information a {
color:orange;
font-size:16px;
}
Ezzel megadtuk,, hogy a bannerben lévő 'a' tagek ("hiperhivatkozások") színe legyen narancs, betűméretük 16pixel.
Jöjjön egy kicsit bővebben a hozzászólás doboz:
[IMG]http://i.imgur.com/uQ6BcmB.jpg[/IMG]
Amint látszik, a #content -el változtattuk meg az alapból fehér hátteret (ha van beállítva háttérszín, akkor [URL=http://sg.hu/forum/uzenet/1405410824/25]nem elég ezt[/URL] megváltoztatni!)
Hozzászólás dobozait is nagyon egyszerűen testre lehet szabni. lényegében áll egy body és egy footer részből. Mindkettő kinézetét változtathatjuk egyszerűen:
#forum-posts-list .body {
background: #fff;
}
#forum-posts-list .footer {
background: #add8e6;
color: #fff;
border: none;
}
Ezzel megadtuk, hogy a hozzászólás háttere legyen fehér, az aláírás meg világoskék, fehér betűkkel, a border:none-al meg eltüntettek a kettőt elválasztó fekete csíkot (a képen ez nincs ezért ott látszik).
Remélem segít ez a kis leírás valamennyit, de amennyiben még valami mindig nem működne megfelelően csak írjatok ide topikba. Jövőben esetleg írok egy még részletesebb írást, amire majd a jövőben lehet hivatkozni.
Informatika és tudomány
