Ang paglalagay ng isang imahe sa background sa isang website ay isang limang minutong kapakanan. Mas maraming oras ang ginugugol sa paghahanda ng imahe - pagpili, pagsasaayos, pagdaragdag ng mga epekto, pagbubuo ng maraming mga guhit sa isang graphic file.
Panuto
Hakbang 1
Ang katangian ng background ay responsable para sa pamamahala ng background. Upang pantay na punan ang pahina ng isang solong kulay, gamitin ang style tag sa katawan:. Magiging itim ang background. Kung gumagamit ng CSS, ilagay sa iyong ulo: katawan {background-color: # 000000;}
Hakbang 2
Sa tulong ng isang link, nakatakda ang isang paulit-ulit na imahe. Ang address ay tinukoy bilang isang panlabas o panloob na link. Kapag ginagamit ang pamamaraang ito, mahalaga na ang mga tahi sa pagitan ng mga imahe ay mananatiling hindi nakikita, kung hindi man ang pahina ay magmumukhang sloppy. Sa CSS, gamitin ang: body {background-color: # 000000; background-image: url (mga imahe / pattern.png);}.
Hakbang 3
Ang pag-uulit ng pattern ay maaaring makontrol. Responsable ang background-repeet para sa pagpapaandar na ito kasama ang mga sumusunod na elemento: - ulitin-x - pahalang na pag-uulit; - ulitin-y - patayong pag-uulit: - ulitin - pag-uulit sa parehong direksyon; ito: katawan {background-color: # 000000; background-image: url ("butterfly.gif"); background-ulit: walang ulit; }
Hakbang 4
Tumutulong ang posisyon sa background upang iposisyon ang imahe sa nais na bahagi ng web page. Ang mga Coordinate ay maaaring itakda gamit ang porsyento (50% 75%), sentimetro (5cm 5cm), aspeto ng pixel (200px 400px), form ng salita (kaliwa, kanan, itaas, gitna, ibaba). Halimbawa: body {background-color: # 000000; background-image: url ("butterfly.gif"); background-ulit: walang ulit; background-attachment: naayos; background-posisyon: kaliwang ilalim; } Ang halagang 0% 0% ay katumbas ng kaliwang tuktok.
Hakbang 5
Ang pag-aari ng background-attachment ay tumutukoy kung ang mga imahe ay na-scroll kasama ang pahina (background-attachment: scroll) o hindi (background-attachment: naayos).
