Lepa lastnost, ki jo boste našli na mnogih spletnih mestih, je, da se zdi, da osrednje področje vsebine prekriva stran s senco za njo. To je pravzaprav dokaj preprost način, da vaš blog lepo izgleda (ali druga spletna stran) z eno samo sliko v ozadju.
Kako je to storjeno?
- Ugotovite, kako široka je vaša vsebina. Primer: 750 slikovnih pik.
- Sliko v aplikaciji za ilustracije (uporabljam Illustrator) zgradite širše od področja vsebine. Primer: 800 slikovnih pik.
- Nastavite ozadje slike na ozadje, ki ga želite imeti na vsaki strani bloga.
- Nad ozadjem dodajte belo območje.
- Nanesite senco na belo območje, ki se iztisne z obeh strani območja.
- Širino območja obrezovanja nastavite za 1 slikovno piko v višino. Tako bo slika za prenos lepa in kompaktna za hitro upodabljanje.
- Iznesite sliko.
Evo, kako sem ga zgradil s pomočjo Illustratorja (upoštevajte, da imam območje obrezovanja veliko višje ... to je samo zato, da vidite, kaj počnem):
Tu je primer, kako bi bil izhod videti s sliko v ozadju:
Tukaj je opis, kako sliko uporabiti s pomočjo oznake vašega sloga telesa v vašem CSS Datoteka.
ozadje: # B2B2B2 url ('images / bg.gif') center za ponavljanje;
Tu je razčlenjevanje oznake sloga ozadja:
- # B2B2B2 - nastavi splošno barvo ozadja strani. V tem primeru je siva, da se ujema s sivo na sliki v ozadju.
- url ('images / bg.gif') - nastavi sliko v ozadju, ki jo želite uporabiti.
- repeat-y - nastavi sliko za ponovitev na osi y. Slika v ozadju se bo torej ponovila od vrha do dna strani.
- center - nastavi sliko na sredino strani.
Lepo in enostavno ... ena slika, ena slog oznaka!
Ta objava je bila napačna!
http://www.digg.com/design/Body_Background_Images_Done_Easily
Hvala. Dobro mi je uspelo!