Umiestnenie obrázka na pozadí na webovú stránku je päťminútová záležitosť. Oveľa viac času sa venuje príprave obrazu - výber, úprava, pridanie efektov, zloženie niekoľkých ilustrácií do jedného grafického súboru.
Inštrukcie
Krok 1
Atribút pozadia je zodpovedný za správu pozadia. Ak chcete stránku rovnomerne vyplniť jednou farbou, použite značku štýlu v tele:. Pozadie bude čierne. Ak používate CSS, vložte do položky head: body {background-color: # 000000;}
Krok 2
Pomocou odkazu sa nastaví opakujúci sa obrázok. Adresa je uvedená ako externý alebo interný odkaz. Pri použití tejto metódy je dôležité, aby švy medzi obrázkami zostali neviditeľné, inak bude stránka vyzerať nedbalo. V CSS použite: body {background-color: # 000000; background-image: url (images / pattern.png);}.
Krok 3
Opakovanie vzoru je možné riadiť. Opakovanie pozadia je zodpovedné za túto funkciu spolu s nasledujúcimi prvkami: - opakovanie-x - horizontálne opakovanie; - opakovanie-y - vertikálne opakovanie: - opakovanie - opakovanie v oboch smeroch; - neopakovanie - bez opakovania. Je nastavené ako toto: body {background-color: # 000000; background-image: url ("butterfly.gif"); background-repeat: no-repeat; }
Krok 4
Pozícia na pozadí pomáha umiestniť obraz do požadovanej časti webovej stránky. Súradnice je možné nastaviť pomocou percentuálneho podielu (50% 75%), centimetrov (5 cm 5 cm), pomeru pixelov (200 pixelov 400 pixelov), formy slova (zľava, sprava, zhora, zo stredu, dole). Napríklad: body {background-color: # 000000; background-image: url ("butterfly.gif"); background-repeat: no-repeat; príloha na pozadí: opravená; Pozícia na pozadí: vľavo dole; } Hodnota 0% 0% sa rovná ľavému hornému rohu.
Krok 5
Vlastnosť background-attachment určuje, či sa majú obrázky posúvať spolu so stránkou (background-attachment: scroll) alebo nie (background-attachment: fixed).
