Az oldal menüje
 
Az év weboldala - 2013


Photoshop leírások

Ikonbázis
Galéria
 

 
Címkék

A blogban leggyakrabban használt címkék

 

Neko

CSS kód a G-Portálon
CSS kód a G-Portálon : Több háttér oldaladnak CSS-el

Több háttér oldaladnak CSS-el


<style type="text/css">
body {
    background-attachment: scroll !important;
    overflow: -moz-scrollbars-vertical;
    overflow-x: hidden;
    background-image: url(//aranymeli.gportal.hu/portal/aranymeli/image/gallery/1393355368_69.png), url(//aranymeli.gportal.hu/portal/aranymeli/image/gallery/1393528647_74.png);
    background-color: #e8e9e8;
    background-position: center top, center top;
    background-repeat: repeat-x, repeat-y;
}
--></style>

A background-image kódrészbe kell a hátterek url címét bemásolni a zárójelen belülre! Egymás után vesszővel elválasztva kell az url-eket feltüntetni ahogy a kódban is látható.

Nekem jelenleg a két hátterem ez:

Az egyik hátterem a fejléc alatt található a lap tetején, míg a másik háttér pedig a modulok alatt helyezkedik el.

Az elhelyezkedést a kódban ezekkel a beállításokkal tudod megadni:

background-position: center top, center top;
background-repeat: repeat-x, repeat-y;

A background-position: center top, center top; beállítással azt adod meg, hogy pontosan hol legyen a háttér. Itt most középen és felül helyezkedik el. Ez a zöld háttérre vonatkozik.
Itt is egymás után vesszővel elválasztva kell a hátterek helyzetét megadni. Értelemszerűen sorba veszi fel az értékeket a kód. Tehát az először beillesztett háttérnek az először megírt elhelyezkedés lesz aktív és a többi.

A második hátteremet szintén középre és felülre állítottam, amik a modulok alatt helyezkednek el, mert a kód következő sorában van, hogy a háttér hogyan legyen folyamatos.

A background-repeat: repeat-x, repeat-y; kóddal lehet a háttereket folyamatossá tenni. Az első zöld háttérnél a repeat-x-et választottam, mert így vízszintesen lesz folyamatos a háttér, tehát elvileg bármekkora böngészőben nézed az oldalt, a zöld háttér teljes lesz benne.
A második szürke háttérnek pedig a repeat-y-t választottam, mert így a háttér függőlegesen lesz folyamatos lefelé.

És, hogy a háttereken kívül is legyen színe az oldalnak, így még háttérszínt is adtam neki, ami a világosabb szürke a modulok két szélén.

Ezen az oldalon van egy jó kis előnézet, ahol jobben lehet értelmezni a hátterek folyamatosságát:
http://www.w3schools.com/cssref/playit.asp?filename=playcss_background-repeat

A hátterek pozíciójáról is van egy jó kis előnézet.
http://www.w3schools.com/cssref/playit.asp?filename=playcss_background-position

Még nincs hozzászólás.
Csak regisztrált felhasználók írhatnak hozzászólást.
 

Itachi Shinden második fejezet!! - ÚJ FEJEZET - Felkerült a könyv második harmada!! Konoha.hu - KATT!! KATT! KATT!! KATT    *****    Pont ITT Pont MOST! Pont NEKED! Már fejlesztés alatt is szebbnél szebb képek! Ha gondolod gyere less be!    *****    Kedves Csokoládé kedvelõk! Segítségeteket kérném a kérdõívem kitöltéséhez! Témája a CSOKOLÁDÉ MÁRKÁK! Köszön    *****    Mindig tudnod kell, melyik kikötõ felé tartasz. - ROSE HARBOR, a mi városunk - FRPG    *****    A boroszkányok gyorsan megtanulják... Minden mágia megköveteli a maga árát. De vajon mekkora lehet ez az ár? - FRPG    *****    Alkosd meg a saját karaktered, és irányítsd a sorsát! Vajon képes lenne túlélni egy ilyen titkokkal teli helyen? - FRPG    *****    why do all monsters come out at night - FRPG - Csatlakozz közénk! - Írj, és éld át a kalandokat!    *****    Aki szörnyekkel küzd, vigyázzon, nehogy belõle is szörny váljék. S ha hosszasan tekintesz egy örvénybe, az örvény vissza    *****    Rose Harbor, ahol a tenger suttog és a múlt sosem tûnik el teljesen. - FRPG - csatlakozz közénk te is :)    *****    Egy kikötõ, ahol minden hullám egy új kezdetet ígér. Rose Harbor, több mint egy város, egy világ a világ mögött.    *****    Rose Harbor &#8211; kisvárosi báj, nagy titkokkal - légy részese te is ennek a kalandnak :) - FRPG    *****    Óceán, erdõ, csillagfény &#8211; minden ösvény Rose Harborba vezet - aktív FRPG közösség    *****    Itachi Shinden 1. kötet Magyarul elérhetõ a konoha.hu -n. Nézzetek be! *** Itachi Shinden 1. kötet Magyarul elérhetõ!!!    *****    ÁGICAKÖNYVTÁRA - KÖNYVEK, KÖNYVEK, KÖNYVEK - ÁGICAKÖNYVTÁRA    *****    MOVIE-NIGHT -> Filmek, Sorozatok <- MOVIE-NIGHT    *****    Movie-    *****    Játssz a színekkel keress szebbnél szebb képeket, építs, szépítsd a portálod, hogy szebb és színesebb legyen a világod!    *****    Debrecen Huszti Lakóparki napelemes családiház eladó. 06209911123 Debrecen Huszti Lakóparki napelemes családiház eladó.    *****    Pont ITT Pont MOST! Pont NEKED! Már fejlesztés alatt is szebbnél színes szebb képek! Ha gondolod gyere less be!    *****    Kedves Csokoládé kedvelõk! Segítségeteket kérném a kérdõívem kitöltéséhez! Témája a CSOKOLÁDÉ MÁRKÁK! Köszön