Paano Magdagdag ng isang Background sa isang Website: 14 Hakbang (na may Mga Larawan)

Talaan ng mga Nilalaman:

Paano Magdagdag ng isang Background sa isang Website: 14 Hakbang (na may Mga Larawan)
Paano Magdagdag ng isang Background sa isang Website: 14 Hakbang (na may Mga Larawan)

Video: Paano Magdagdag ng isang Background sa isang Website: 14 Hakbang (na may Mga Larawan)

Video: Paano Magdagdag ng isang Background sa isang Website: 14 Hakbang (na may Mga Larawan)
Video: PAANO MAG PADALA NG MGA DOKUMENTO SA EMAIL (GMAIL) |PINOYTUTORIAL 2024, Abril
Anonim

Ang background ay isa sa mga pinakamahalagang elemento ng isang website. Ang isang mahusay na background ay lumilikha ng tono para sa website at umakma sa nilalaman. Mayroong maraming iba't ibang mga paraan upang magdagdag ng isang background, bawat paraan na may iba't ibang layunin. Pinapayagan ka ng ilang pamamaraan na ilapat ang background sa lahat ng mga pahina sa isang website, habang ang iba ay nililimitahan ang background sa isang tiyak na pahina lamang. Itinuturo sa iyo ng artikulong ito kung paano magdagdag ng isang background sa iyong website gamit ang HTML o CSS.

Mga hakbang

Paraan 1 ng 2: Mga Paraan ng HTML

Solid na Kulay na Background

Magdagdag ng isang Background sa isang Website Hakbang 1
Magdagdag ng isang Background sa isang Website Hakbang 1

Hakbang 1. Ang isang solidong may kulay na background ay ang pinaka pangunahing uri ng background na maaari mong ilagay sa isang website

Sa katunayan, ang bawat website ay nagsisimula sa isang default na puting background. Gayunpaman, habang ang isang puting background ay maaaring maging napaka-makinis at malinis na pagtingin kapag ginamit sa isang maayos na scheme ng kulay, ang isang iba't ibang mga may kulay na background ay maaaring pinaboran ng iba't ibang mga tema.

Magdagdag ng isang Background sa isang Website Hakbang 2
Magdagdag ng isang Background sa isang Website Hakbang 2

Hakbang 2. Buksan ang iyong web code (pinagmulan)

Magdagdag ng isang Background sa isang Website Hakbang 3
Magdagdag ng isang Background sa isang Website Hakbang 3

Hakbang 3. Sa body tag, magdagdag ng isang katangian na tinatawag na bgcolor

Ngayon, ang tag ng iyong katawan ay dapat magmukhang ganito-

kung saan ang COLORNAME ang pangalan ng kulay. Ang COLORNAME ay maaaring mapunan ng maraming uri ng mga kinatawan ng kulay-

  • (pangalan ng kulay)
  • (hex halaga)
  • (Halaga ng RGB)
Magdagdag ng isang Background sa isang Website Hakbang 4
Magdagdag ng isang Background sa isang Website Hakbang 4

Hakbang 4. Ang pag-eksperimento sa RGB at # ay maaaring humantong sa maraming mga shade, ngunit maaari mong gawin ang madaling unang paraan

Ngunit tandaan na ang pagta-type ng isang hindi pangkaraniwang kulay bilang "Ultramarine Bluish Green" ay magreresulta sa puti.

Pagdaragdag ng isang Imahe sa Background

Ang pagdaragdag ng isang imahe sa background ay bahagyang mas kumplikado kaysa sa isang solidong kulay na background

Magdagdag ng isang Background sa isang Website Hakbang 5
Magdagdag ng isang Background sa isang Website Hakbang 5

Hakbang 1. Idagdag ang pag-aari ng background sa tag ng katawan, kaya ganito ang hitsura-

kung saan ang SRC ay ang pinagmulan ng imaheng SRC ay maaaring nasa parehong folder, o ibang folder / webpage.

  • (sa parehong folder)
  • (sa loob ng ibang folder)
  • (sa ibang webpage)
Magdagdag ng isang Background sa isang Website Hakbang 6
Magdagdag ng isang Background sa isang Website Hakbang 6

Hakbang 2. Tandaan na i-type ang.gif /-j.webp" />

Paraan 2 ng 2: Mga Pamamaraan ng CSS

Magdagdag ng isang Background sa isang Website Hakbang 6
Magdagdag ng isang Background sa isang Website Hakbang 6

Solid na May Kulay na Background

Magdagdag ng isang Background sa isang Website Hakbang 7
Magdagdag ng isang Background sa isang Website Hakbang 7

Hakbang 1. Upang magdagdag ng isang solidong may kulay na background sa CSS, magdagdag ng isang katangian ng estilo

Maaari ka ring magbigay ng mga ID at Klase at gumamit ng parehong panlabas at panloob na mga styleheet.

Magdagdag ng isang Background sa isang Website Hakbang 8
Magdagdag ng isang Background sa isang Website Hakbang 8

Hakbang 2. Dapat ganito ang hitsura ng iyong body tag-

kung saan ang COLORNAME ay ang pangalan ng kulay, hex halaga o RGB (Tandaan din ang mga huling hakbang ng solidong kulay na background sa HTML, ang naaangkop din dito).

Pagdaragdag ng isang Imahe

Magdagdag ng isang Background sa isang Website Hakbang 9
Magdagdag ng isang Background sa isang Website Hakbang 9

Hakbang 1. Upang magdagdag ng isang imahe, idagdag ang katangiang istilo sa body tag

Maaari ka ring magbigay ng mga ID at Klase at gumamit ng parehong panlabas at panloob na mga styleheet.

Magdagdag ng isang Background sa isang Website Hakbang 10
Magdagdag ng isang Background sa isang Website Hakbang 10

Hakbang 2. Dapat ganito ang hitsura ng iyong body tag-

Magdagdag ng isang Background sa isang Website Hakbang 11
Magdagdag ng isang Background sa isang Website Hakbang 11

Hakbang 3. Tandaan na ang SRC ang mapagkukunan

Maaari itong magmula sa parehong folder, iba't ibang folder o ibang web page.

  • (sa parehong folder)
  • (sa loob ng ibang folder)
  • (sa ibang web page).
Magdagdag ng isang Background sa isang Website Hakbang 12
Magdagdag ng isang Background sa isang Website Hakbang 12

Hakbang 4. Tandaan na idagdag ang. Mga extension din

Umuulit na Background na May pattern

Magdagdag ng isang Background sa isang Website Hakbang 13
Magdagdag ng isang Background sa isang Website Hakbang 13

Hakbang 1. Upang makagawa ng isang paulit-ulit na background na pattern, magdagdag ng isang background tulad ng sinabi sa mga hakbang sa itaas

Dapat palitan ang iyong body tag ngayon sa-

Kung saan ang mga REPEAT-SETTING ay ang mga setting. Maaaring maraming mga setting ng paulit-ulit, tulad ng-

  • (Ang background ay ulitin ang parehong patayo at pahalang.)
  • (Ang background ay uulit nang pahalang.)
  • (Ang background ay uulit-ulit nang patayo.)

Naayos ang Background ng Larawan

Magdagdag ng isang Background sa isang Website Hakbang 14
Magdagdag ng isang Background sa isang Website Hakbang 14

Hakbang 1. Ang mga nakapirming mga background ng imahe ay mukhang cool at hindi nagbabago habang nag-scroll pababa

Upang gawin ang mga ito kailangan mo lamang gawin ang ilang mga simpleng pag-aayos sa code sa seksyon sa itaas. Gawin ang mga pag-aayos upang maging ganito ang body tag-

kung saan ang SRC ay ang pinagmulan ng background na imahe, ang POSITION ay ang posisyon ng imahe (maaari itong saklaw mula sa gitna hanggang sa kanang itaas); ang background-attachment ay ang pangunahing "katalista" ng ganitong uri ng background. Ginagamit ito upang sabihin ang posisyon ng background at inirerekumenda na hindi ito dapat baguhin.

Mga Tip

Inirerekumendang: