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.
 

too young and innocent | an aegyo queen | twice | neo culture technology    *****    LÉGY A MAGAD ASZTROLÓGUSA! Regisztrálj oldalamra és én segítelek elsajátítani az asztrológia tudományát!    *****    Tanuld nálam az asztrológiát teljesen ingyen, vagy kérj részletes asztrológiai elemzést &#8222;BECSÜLET KASSZÁS&#8221; alapon!    *****    Új lovas szerepjáték! * Új lovas szerepjáték! * Lépj be a lovak csodálatos világába! Nevelj te is nálunk!    *****    Születési horoszkóp,3 év elõrejelzés,párkapcsolati elemzés ingyenes konzultáció,tájékoztatás az oldalon! kattints ide!!!    *****    Bûbájos Boszorkák - Charmed - Hírek - Extrák - Érdekességek - Charmed - Bûbájos boszorkák - Sok - sok infó - Charmed -    *****    Pénzkeresés az Interneten! Csak is kipróbáld, tesztelt módszerekkel, melyek tényleg fizetnek!    *****    Légy te is Farmasi tanácsadó! Kötetlen munka, befektetés nékül, minõségi termékek, jó kereseti lehetõség!    *****    Sztárok/Bulvár: Tudj meg friss pletykákat, híreket. Katt!    *****    Outsider - Gay - Creative - Rebel - Tolerant - Furry - Brony - Hipster - Gamer - Otherkin - Geek - Autistic    *****    Xtina Hungary - Minden, ami Christina Aguilera!    *****    Légy Te is AVON tanácsadó *** Nyereményjátékok *** Kereseti lehetõség *** Vásárolj kedvezményesen AVON termékeket!    *****    Nyerj ajándékszettet! Töltsd ki a kérdõívet és nyerj! *** Nyerj ajándékszettet! Töltsd ki a kérdõívet és nyerj!    *****    Jófogás Játékvásár - Jófogás Játékvásár - Jófogás Játékvásár - Jófogás Játékvásár     *****    FRPG &#9679; FANTASY SZEREPJÁTÉK &#9679;&#12300;&#914;&#923;SM&#923;IW&#12301; &#9679; FANTASY SZEREPJÁTÉK &#9679; EGY SZIGET + 24 MÁGUS &#9679; FANTASY SZEREPJÁT&Eacut    *****    Itt megtalálhatod a legfrissebb híreket, cikkeket, képeket a Golden Globe- és Oscar-díjas színésznõrõl! Katt!    *****    Furry Fandom - Antropomorf Állatok - Furry Fandom - Antropomorf Állatok - Furry Fandom - Antropomorf Állatok    *****    Légy Te is AVON tanácsadó *** AVON termékek *** Kereseti lehetõség *** Értékesítõ kollégákat keresek *** sminkek    *****    Esküvõi meghívók! Mindegyik kézzel készült, egyedi. Gyere, nézd meg az oldalamat.    *****    A legfrissebb Anime hírek , mindennap anime ajánló , mondocon képek , és hírek. Csatlakozz közösségünkhöz!