Paano Iunat Ang Background Ng Website

Talaan ng mga Nilalaman:

Paano Iunat Ang Background Ng Website
Paano Iunat Ang Background Ng Website

Video: Paano Iunat Ang Background Ng Website

Video: Paano Iunat Ang Background Ng Website
Video: HTML Background Image | Tagalog 2024, Mayo
Anonim

Pinapayagan ng wikang markup ng HTML ang isang taga-disenyo ng web na gumamit ng anumang imahe bilang isang imahe sa background. Gayunpaman, ang wika mismo ay walang mga built-in na kontrol para sa mga background na imahe. Ang mas mahusay na pag-tune ay tapos na gamit ang mga cascading CSS styleheet.

Paano iunat ang background ng website
Paano iunat ang background ng website

Panuto

Hakbang 1

Upang mapalawak ang background sa buong lapad ng browser, kailangan mong gamitin ang parameter ng z-index sa iyong CSS. Pinapayagan kang itakda ang pagkakasunud-sunod ng mga elemento na iyong nilikha. Kung mas mataas ang halaga ng katangiang ito, mas mataas ang bloke ay matatagpuan sa pahina.

Hakbang 2

Lumikha ng mga bagong dokumento sa format na html at css (kanang pindutan ng mouse - "Bago" - "Text file") at buksan ang mga ito gamit ang anumang text editor.

Hakbang 3

Ilagay ang imahe ng background sa ilalim na layer. Ito ay umaabot depende sa resolusyon ng screen. Sa tuktok, may isa pang elemento na makikita kung saan ipapakita ang nilalaman ng pahina. Upang magawa ito, lumikha ng dalawang mga bloke. Sa file ng css isulat:.1layer {z-index: 1; lapad: 100% taas: 100% posisyon: absolute;}. 2layer {Posisyon: absolute; z-index: 2; } Ang posisyon: pinapayagan ka ng ganap na parameter na magtakda ng ganap na pagpoposisyon, ibig sabihin ang layer ay iposisyon nang nakapag-iisa ng iba pang mga elemento.

Hakbang 4

Isama ang nabuong CSS code sa HTML file gamit ang link tag: Background ng pahina

Hakbang 5

Lumikha ng isang bagong layer. Gamit ang tag

maglagay ng larawan dito. Halimbawa: Nilalaman ng pahina Para sa img, ang parameter ng lapad lamang ang tinukoy, sapagkat kung tinukoy mo bilang karagdagan ang taas, sa ilang mga browser, lilitaw ang pagbaluktot ng imahe.

Hakbang 6

I-save ang iyong mga pagbabago. Upang subukan ang iyong code, palakihin ang pahina sa window ng iyong browser. Dapat ding palakihin ang imahe sa background.

Inirerekumendang: