Paano gumawa ng background ng larawan sa HTML at CSS. 3 simpleng paraan

Itinatakda ang kulay ng plano sa likod mula sa palette. Ang kulay ng tagapagmana ay palaging tumutugma sa kulay ng elemento ng ninuno.
Pagbati. Sa artikulong ito, nais kong sabihin tungkol sa tatlong paraan upang maglagay ng isang imahe bilang isang background ng buong pahina gamit lamang ang HTML + CSS (nang hindi gumagamit ng JS).

Pagbati. Sa artikulong ito, nais kong sabihin tungkol sa tatlong paraan upang maglagay ng isang imahe bilang isang background ng buong pahina gamit lamang ang HTML + CSS (nang hindi gumagamit ng JS).

Kaya, ang mga kinakailangan para sa larawan sa background na kami ay ang mga sumusunod:

  • 100% lapad at taas na sakop ng pahina
  • Ang mga antas ng background kung kinakailangan (background ay nakaunat o naka-compress depende sa laki ng screen)
  • I-paste ang mga sukat ng mga larawan (aspect ratio)
  • Image nakasentro sa pahina
  • Ang background ay hindi nagiging sanhi ng mga scroll
  • Ang solusyon ay pinakamataas na crossbrawser.
  • Walang iba pang mga teknolohiya ang ginagamit maliban sa CSS.

Itinatakda ang kulay ng plano sa likod mula sa palette. Ang kulay ng tagapagmana ay palaging tumutugma sa kulay ng elemento ng ninuno.

Paraan 1.

Sa palagay ko, ito ang pinakamahusay na paraan, dahil ito ay ang pinakamadaling, maigsi at modernong. Ginagamit nito ang ari-arian ng CSS3 Laki ng background. na nalalapat namin sa tag HTML. . Eksakto HTML. , ngunit hindi Katawan. dahil Ang taas nito ay mas malaki kaysa sa o katumbas ng taas ng window ng browser.

Mag-install ng isang nakapirming at nakasentro na background, pagkatapos ay ayusin ang laki nito gamit Background-size: Cover. .

Html { 

Background-image: URL (mga imahe / background.jpg);

Background-ulitin: walang ulit;

Background-position: center center;

Background-attachment: naayos;

-Webit-background-size: takip;

-Moz-background-size: takip;

-O-laki ng background: takip;

Laki ng background: takip; 
} 

Demo.

Ang pamamaraan na ito ay gumagana sa.

  • Chrome (anumang bersyon)
  • Opera 10+.

Firefox 3.6+.

Safari 3+.

Ie 9+.

Upang mabilis na i-load ang mga larawan, ilagay lamang ang iyong mga site mula sa napatunayan na mga provider ng hosting, halimbawa, BeGeGe.com 
Gustung-gusto ng mga gumagamit at mga search engine ang mabilis na mga site. 

Background-image: URL (mga imahe / background.jpg);

Paraan 2.

Ang pamamaraan na ito ay nagbibigay para sa paggamit ng elemento ng IMG, ang sukat nito ay mag-iiba depende sa laki ng window ng browser. Upang mahatak ang imahe sa buong screen, kailangan nito upang itakda ang min-taas at lapad na may halaga na 100%. At upang ang imahe ay hindi naka-compress sa mas maliit na sukat kaysa sa orihinal, i-install ang min-lapad na may halaga ng pantay na lapad ng larawan.

Kung ang lapad ng window ay mas mababa kaysa sa lapad ng imahe, ang query sa media ay gagamitin upang ihanay ang background sa gitna.

magmana.

<img src = "/ images / background.jpg" class = "background" />

img.background { Min-taas: 100%; Min-lapad: 640px; lapad: 100%; Taas: Auto;

Posisyon: naayos; Nangungunang: 0; Kaliwa: 0;

/ * Depende sa laki ng imahe * /

@Media screen at (max-width: 640px) { img.bg { и Kaliwa: 50%; Margin-left: -320px; } } } Demo.

Ay nagmamana ng lahat ng mga katangian ng elemento ng magulang

Gumagana ang pamamaraang ito sa:

Anumang mga bersyon ng magagandang browser (Chrome, Opera, Firefox, Safari) Ie 9+. и Paraan 3. . Ang isa pang paraan ay ang mga sumusunod: Ayusin ang imahe <IMG /> sa itaas na kaliwang sulok ng pahina at mag-abot ito gamit ang min-lapad at min-taas na mga katangian ng 100%, habang pinapanatili ang aspect ratio. Totoo, sa diskarte na ito, ang larawan ay hindi nakasentro. Ngunit ang problemang ito ay nalutas sa pamamagitan ng balot ang larawan sa <div />, na ginagawa namin 2 beses ang laki ng window. At ang imahe mismo ay umaabot at inilagay sa gitna. <div class = "background"> <img src = "/ images / background.jpg" />

</ div> Div.background { <div class = "background"> Posisyon: naayos;

Nangungunang: -50%;

Kaliwa: -50%; } lapad: 200%; Taas: 200%; }

img { Posisyon: absolute; Nangungunang: 0;

Kaliwa: 0; Kanan: 0; :

Ibaba: 0;

Margin: Auto; Min-lapad: 50%; Min-height: 50%; } .

Ang pamamaraan na ito ay gumagana sa mga magagandang browser at ie 8+.

Umaasa ako na ang impormasyong ito ay magiging kapaki-pakinabang para sa iyo. Sa personal, madalas kong ginagamit ang mga pamamaraan na ito, lalo na. Tiyak na may iba pang mga paraan upang maglagay ng isang imahe sa back background na may CSS. Kung alam mo ang tungkol sa mga ito, ibahagi, mangyaring komento. Itakda ang kulay ng background at / o isang larawan para sa isang pahina o isang hiwalay na item ay sapat na simple. Ang pangunahing bagay ay upang malaman kung saan at kung paano ito magagawa, pati na rin magkaroon ng isang code ng kulay at / o isang larawan sa background. Posible na mula sa artikulong ito matututunan mo ang maraming mga bagong bagay, ngunit nilikha ko ito partikular para sa mga nagsisimula. Samakatuwid, ang lahat ay magiging maikli hangga't maaari at detalyado nang sabay-sabay. Ang pangunahing bagay ay na matatanggap mo hindi lamang ang pangkalahatang pagtatanghal at mga handa na halimbawa, kundi pati na rin ang pag-unawa kung paano gumawa ng background sa HTML. Upang itakda ang background sa HTML gamitin ang Intermediate DocType At magsisimula ako sa katotohanan na HTML5. Walang posibilidad na itakda ang background para sa site. Ang tampok na ito ay nagpasya na magtiis sa CSS. Samakatuwid, kung plano mong gamitin sa ibaba, at nais mong makakuha ng isang wasto » (tama) Code, kailangan mong manatili sa uri ng paglipat ng dokumento. Upang gawin ito, dapat magsimula ang iyong web page sa sumusunod na linya: <! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 » Transitional. // en "" http://www.w3.org/tr/html4/loose.dtd ">

Oras para sa mga praktikal na klase

Paano ang background sa isang web page? (#)Kung naisip mo ito, maunawaan natin kung paano nilikha ang background. At ang unang bagay dito ay dapat pansinin - ito ang pagkakaiba sa pagitan

Kulay ng background

Larawan ng background

. Sa simula ay napupunta

Kulay ng background Kaliwa: 50%; na baha ang lahat ng magagamit na puwang ng pahina o elemento nito. Ang paulit-ulit sa ibabaw nito larawan ng background }

. Biswal, ito ay maaaring ilarawan bilang mga sumusunod: Posisyon: absolute; Nangungunang: 0;

Background ng HTML na dokumento at mga elemento nito

Pagkatapos ng disappointing ang mga pangunahing elemento ng backdrop control, pati na rin ang kanilang mga katangian, magpatuloy nang direkta sa pagtatasa ng isang tiyak na halimbawa. Sa code ng programa na ipinapakita sa ibaba, sinubukan kong paganahin ang lahat ng inilarawan na mga elemento.

Ang pangalawang bagay na kailangan mong malaman ay ang pagkakaiba sa pagitan

katawan ng dokumento Kanan: 0; :

elemento ng dokumento

Katawan ng dokumento

ipinahiwatig sa html code ng tag ng web page

Katawan. na kinabibilangan ng lahat ng nilalaman ng web page. Malinaw, ang background ng dokumento ng dokumento ay hindi maaaring maging transparent. Kung hindi tinukoy ang background ng katawan ng dokumento, ginagamit ang default na halaga na tinukoy sa mga setting ng browser. Mga elemento ng pahina ay nasa loob ng tag }

. Kapansin-pansin na maaari mong itakda ang kulay at / o larawan sa background gamit ang HTML sa lahat ng mga elemento ng dokumento. Halimbawa, ang larawan sa background ay maaaring tinukoy lamang para sa mga talahanayan. Bilang default, kadalasan ay may isang transparent na background. Posisyon: absolute; Nangungunang: 0;

Attribute bgcolor upang lumikha ng kulay ng background

Upang magtanong

Ang dokumento o mga elemento nito ay ginagamit attribute. Taas: 200%; и larawan ng background bgcolor , halimbawa: <Body bgcolor = "# ec008c">

<! - dokumento katawan ->

</ Body>

Sa kasong ito, itinakda namin ang kulay ng background para sa pahina nang buo. Ngunit isang halimbawa kung paano itakda ang kulay ng background para sa talahanayan, sa tag Table. <Table bgcolor = "# ec008c"> <tr> <td> text na may background </ td> </ tr> </ table>

Kapansin-pansin na ang kulay ng background sa talahanayan ay maaari ring tinukoy para sa mga hilera sa tag

Tr. At para sa kanilang mga selula sa tag TD.

Paano malaman ang code ng kulay? Marahil ay napansin mo na ang kulay sa HTML ay nakatakda sa espesyal Code. HTML. , halimbawa:

# EC008C.

  • . Upang malaman ang code na kailangan mo ang kulay maaari mong gamitin ang isa sa mga editor ng graphics. Halimbawa, sa Photoshop maaari mong gamitin ang "
  • Eyedropper tool.
  • (Pipette)

Upang makakuha ng isang kulay mula sa isang punto sa larawan. Pagkatapos, kailangan mong i-click ang resultang kulay sa toolbar at sa window na bubukas "

Kulay Picker. (Pagpili ng kulay) Kopyahin ang code ng kulay. Kinukuha ko ang iyong pansin sa katotohanan na ang code na ito ay walang isang lattice sign Sa simula, ang tanda na ito ay kailangang idagdag nang manu-mano.

Maaari ka ring gumamit ng maraming mga serbisyong online, halimbawa: 
Mas madali ang kanilang prinsipyo ng trabaho - i-click ang nais na kulay at makakuha ng code. Attribute background upang lumikha ng isang larawan sa background. Pati na rin sa kaso ng kulay ng background at sa kaso ng
Kailangan mong gumamit ng isang espesyal na katangian, samakatuwid 
background. 
<body background = "/ 2014/06 / bg.jpg">

В HTML. Sa kasong ito, hinihiling namin ang larawan sa background para sa pahina nang buo. Kapansin-pansin na dahil sa mga limitasyon ng laki ng larawan, ito ay paulit-ulit, halimbawa: Tulad ng nakikita mo, kapag ang pag-uulit, ang paglipat sa pagitan ng mga larawan ay kapansin-pansin. Samakatuwid, ang mga espesyal na larawan ay kadalasang ginagamit, kung saan ang sandaling ito ay isinasaalang-alang. Ngunit isang halimbawa kung paano magtakda ng larawan sa background para sa isang table, sa tag

<table background = "/ 2014/06 / bg.jpg"> <tr> <td> teksto na may background </ td> </ tr> </ table> HTML. Kapansin-pansin na ang larawan sa background ay maaaring itakda lamang para sa talahanayan bilang isang buo at / o hiwalay na cell nito. Para sa isang string hindi ito gagana. Attribute background upang lumikha ng isang larawan sa background. .

Absolute at kamag-anak na landas sa larawan sa background (Pagpili ng kulay) Hiwalay na nagkakahalaga ng pagbibigay pansin Address background picture. . Sa kasong ito, ang kamag-anak na landas sa larawan ay ginagamit, i.e. Ang address ay ipinahiwatig sa lokasyon ng file ng imahe sa file ng web page. Ang pagpipiliang ito ay hindi maaaring tinatawag na partikular na matagumpay. Pinakamainam na gamitin ang ganap na landas sa larawan, i.e.

ang buong url nito <body background = "/ images / bg.jpg"> .

Sa kasong ito, hindi ka magkakaroon ng magkakatulad na mga problema. Para sa higit pa tungkol dito maaari mong basahin dito.

Ibigay ang buod 
Gamit ang mga katangian moral na lipas na sa panahon, dahil para sa bisa ng html code ay kailangan mong gamitin ang transisyonal DOCTYPE.

. Upang itakda ang kulay ng background sa HTML, gumagamit ng mga espesyal na code na maaari mong malaman sa isang graphic na editor o paggamit ng mga espesyal na serbisyong online. Ang larawan sa background ay nadoble sa mga buntot ng lugar na inilaan at namamalagi sa tuktok ng kulay ng background. Upang tukuyin ang isang larawan sa background, mas mahusay na gamitin ang buong URL nito. Mayroon akong lahat ng bagay dito. Salamat sa atensyon. Good luck!

Maikling Link: http://goo.gl/03tsnz. Paano gumawa ng background para sa site? Ang anumang silid ay magiging mas mahusay kung ang kanyang sahig ay tumataas na mahal na Persian karpet. Kaya mas masahol ang iyong site? Marahil ito ay oras at ang kanyang sahig " itakda
  • »Mamahaling eleganteng palasyo ng kamay. Maunawaan natin ang higit pa tungkol sa kung paano gumawa ng background para sa site:
  • Ito ay nangyayari na ang lumang disenyo ng site ay dumating na. At gusto ko ng bago at masarap. At ang bagong disenyo ay magiging tulad kung lutuin mo ito sa iyong sariling mga kamay.
  • Ngunit upang baguhin ang lahat ng disenyo ng mapagkukunan sa iyong sarili - ang bagay ay walang utang na loob. Oo, at hindi lahat ay may isang bagay tungkol dito. "
  • pinalitan

"Mga kamay. Samakatuwid, ito ay pinakamadaling i-refresh ang lumang template, pagbabago ng kulay ng background ng mapagkukunan o larawan sa background nito.

Mayroong maraming mga paraan upang baguhin ang background sa site. Gumagamit ito ng mga pagkakataon. 
Css. O. . Ngunit marami sa mga katangian para sa pagtatrabaho sa background ay may parehong pangalan at pamamaraan ng aplikasyon sa mga teknolohiyang ito sa web.
  • Bilang isang background, maaari kang gumamit ng maramihang mga item: Kulay; ;
  • Larawan sa background;
  • Imahe ng textural. Haharapin namin ang paggamit ng bawat isa sa mga ito nang mas detalyado. Upang itakda ang kulay ng background sa likod para sa site, ginagamit ang ari-arian.

kulay ng background.

Estilo attribute. 

Estilo. . Iyon ay, upang itakda ang pangunahing kulay para sa web page, kailangan mong irehistro ito sa loob ng tag na <body>. Halimbawa: <Body style = "background-color: # 55d52b"> <p> background ng site # 55d52b </ p> </ body>

Bilang karagdagan sa hexadecimal color code, ang halaga ay suportado sa format ng keyword o

Rgb. 

. Mga halimbawa:

<Body style = "background-color: rgb (51,255,153)"> <p> background ng RGB website (23,113,44) </ p> </ body> <Body style = "background-color: green"> <p> background ng green website </ p> </ body> Ang pagtatakda ng kulay ng background gamit ang mga keyword ay may ilang mga paghihigpit kumpara sa natitirang dalawang paraan.

Ang kabuuang 16 na keyword ay sinusuportahan para sa setting na kulay. Narito ang ilan sa mga ito:

Puti, pula, asul, itim, dilaw. iba. Samakatuwid, upang itakda ang background para sa site

Mas mahusay na gamitin ang hexadecimal na format o 

Bilang karagdagan sa pagpili ng kulay, magagamit ang iba pang mga setting. Kung ang ari-arian Itakda ang halaga Transparent

Ang background ng pahina ay magiging transparent. Ang halaga na ito ay itinalaga sa ari-arian na ito bilang default. Ngayon isaalang-alang ang posibilidad ng isang hypertext na wika upang i-install ang pattern ng background para sa site. Posible na gawin ito gamit ang ari-arian. background-image.

Halimbawa: 

<Body style = "background-image: url (IMG_1809.jpg)"> </ body>

Tulad ng makikita mula sa code, ang umiiral na imahe ay nangyayari sa landas

Url.

Nai-post sa mga braket. Ngunit hindi lahat ng mga larawan ay naging malaki upang mapunan ang buong lugar ng screen gamit ang kanilang mga laki. Tingnan natin kung paano ipapakita ang mas maliit na figure.

Ipagpalagay na kami ay bumubuo ng isang site tungkol sa mga tula, at bilang isang substrate kailangan mong gamitin ang imahe ng Pegasus. Ang Winged Horse ay personify ang kalayaan ng malikhaing pag-iisip ng makata!

Kailangan namin na ang imahe ay ipinapakita sa gitna ng screen nang isang beses. Ngunit, sa kasamaang-palad, hindi nauunawaan ng browser ang aming kahanga-hangang mga hangarin. At nagpapakita ng mas maliit na larawan para sa background ng site nang maraming beses habang ang lugar ng screen ay maaaring tumanggap ng:

Marahil apat na nakangiting kabayo na may mga pakpak ng mga poets ay masyadong maraming para sa inspirasyon. Samakatuwid, ipagbawal ang pag-clone ng aming Pegasus. Gawin ito gamit ang ari-arian

background-ulitin. . Mga posibleng halaga: Ulitin-X - Pag-uulit ng larawan sa background nang pahalang;

Kaya, pinadali namin ang gawain upang itakda ang back background mula sa dalawang larawan: animation at regular na imahe. Sa kasong ito, ang GIF animation ay maayos, at ang pagguhit ay naka-scroll kasama ang mga nilalaman ng pahina.

Ulit-y - patayo;

Ulitin - sa parehong mga axes;

Walang-ulit - Ang pag-uulit ay ipinagbabawal.

Kabilang sa mga nakalistang pagpipilian na interesado kami sa huli. Bago baguhin ang background ng site, ginagamit namin ito sa iyong code:

<Body style = "background-image: url (3.jpg); background-repeat: no-repeat"> </ body>

Ngunit, siyempre, ito ay mas mahusay na kung ang aming lowow ay matatagpuan sa gitna ng screen. Ari-arian

Posisyon ng background Lamang ay inilaan upang iposisyon ang pattern ng background sa pahina. Itakda ang mga coordinate ng lokasyon sa maraming paraan:
. Iyon ay, upang itakda ang pangunahing kulay para sa web page, kailangan mong irehistro ito sa loob ng tag na <body>. Halimbawa: Keyword (
<body background = "/ images / bg.jpg"> Itaas, ibaba, sentro, kaliwa, kanan)
O. Porsyento - ang countdown ay nagsisimula mula sa itaas na kaliwang sulok;
Ang anumang silid ay magiging mas mahusay kung ang kanyang sahig ay tumataas na mahal na Persian karpet. Kaya mas masahol ang iyong site? Marahil ito ay oras at ang kanyang sahig " Sa mga yunit ng panukala (
(Pagpili ng kulay) Pixels.
). Ginagamit namin ang pinakamadaling pagpipilian para sa pagsasentro:

<Body style = "background-image: url (3.jpg); background-repeat: no-repeat; background-position: top center"> </ body>

Ito ay nangyayari na kailangan mong ayusin ang posisyon ng pagguhit kapag nag-scroll. Samakatuwid, bago gumawa ng isang larawan ng site, gumamit ng isang espesyal na ari-arian.

background-attachment.

. Wastong mga halaga: <ul> <li> Mag-scroll; </ li> <li> naayos. </ Li> </ ul>

Kailangan namin ang huling kahulugan. Ngayon ang code ng aming halimbawa ay magiging ganito: [/ HTML] 
<body style = "background-image: url (3.jpg); background-repeat: no-repeat; background-position: top center; background-attachment: fixed"> </ body> 

Sa unang halimbawa, para sa background, ginamit namin ang isang malaki at magandang landscape ng disyerto. Ngunit para sa gayong kagandahan kailangan mong magbayad nang buo. Ang bigat ng imahe na ginawa sa mataas na kalidad ay maaaring maabot ang ilang megabytes.

Ang volume na ito ay hindi nakakaapekto sa bilis ng pag-download ng pahina ng browser na may mataas na bilis ng koneksyon sa Internet. Ngunit kung ano ang tungkol sa mobile Internet, kapag ginagamit kung saan ang pag-download ng ilang "

metro

"Magkakaroon ng maraming oras?

"Magkakaroon ng maraming oras? Ang lahat ng mga problemang ito ay nalutas gamit ang isang background ng texture. Gumagamit ito ng isang maliit na imahe bilang isang pattern ng texture. Kahit na sa ilalim ng kondisyon ng maraming pag-uulit nito, ang pattern ay na-load nang isang beses lamang.

Upang lumikha ng isang madilim na background para sa site pumunta sa Katawan. Photoshop. Katawan. , Lumikha ng isang imahe sa anyo ng isang strip ng isang mahabang 1200 pixel, at isang lapad ng 15 pixels. Pagkatapos ay gumagamit kami ng isang simpleng itim at puting gradient at ikonekta ang resultang texture sa pahina ng site:

<Body style = "background-image: url (1.png); kulay: rgb (0,51,204)"> </ body>

Para sa kalinawan, nagdagdag kami ng teksto at itinakda ang kulay gamit ang ari-arian. Katawan. Kulay Katawan. . Iyan ang nangyari:

  • Taas: 200%; Ang lahat ng mga katangian na inilarawan sa itaas ay naaangkop din para sa mga cascading style sheet. Lumikha ng isang background ng site
  • larawan ng background Css.
  • Sa pamamagitan ng muling pagsusulat ng code ng isa sa aming mga nakaraang halimbawa: <Head> <title> Document Untitled </ title> <style type = "text / css"> body {background-image: url (3.jpg); background-repeat: no-repeat; Background-position: top center; background-attachment: fixed;} </ style> </ head> <body> </ body>
  • Ang resulta ay magkatulad. Well, tumingin kami sa lahat ng mga pagpipilian, kung paano baguhin ang background sa site. Ngayon ay nananatili lamang ito upang lumikha ng isang pagguhit ng hinaharap na karpet at ipalaganap ito sa mga pahina ng iyong mapagkukunan. Ngunit ito ang iyong kamay.
  • Magandang araw sa lahat upang matuto at matuto ng bago! Nakarating na ba kayo ng pansin sa hitsura ng mga site kapag ang pagbuo ng mga tagalikha ay tamad upang ayusin ang background ng mga pahina? At bumaling ako. Mukhang pagpatay. Kadalasan, dahil sa kakulangan ng karaniwang paghihiwalay sa pagitan ng iba't ibang uri ng impormasyon, ito ay halo-halong at simpleng mawala ang pagnanais na higit pang tumingin sa ganitong mapagkukunan ng web. Kaya nangyari ang nasabing problema sa iyong proyekto, nagpasya akong magsulat ng isang artikulo sa paksa: "Paano gumawa ng background ng mga pahina sa HTML." Matapos basahin ang publication, matututunan mo, kung anong mga tool ang maaari mong itakda ang disenyo ng background, kung paano gumawa ng background na naayos o pagbabago at marami pang iba, na makakatulong na gawing kaakit-akit ang iyong website. Ngayon magsimula tayo!
  • Mga pangunahing tool para sa pagtatakda ng mga web page sa background Upang itakda ang larawan sa background, ang mga developer ng web-language ay nagbigay ng isang katangian ng background. Ito ay magagamit sa parehong HTML at CSS.
  • Sa wika ng markup, ito ay isang katangian ng tag ng katawan, at sa mga estilo ng mga talahanayan - isang unibersal na ari-arian na nagbibigay-daan sa iyo upang i-set up hanggang sa 5 mga katangian ng hulihan plano sa parehong oras. Ang background ay isang medyo nababaluktot na elemento na maaaring magamit upang gawin ang background bilang isang kulay, kulay ng larawan o kahit animation. Kaya, i-install ang larawan sa background sa pamamagitan ng yunit ng HTML <body> sapat na upang isulat ang naturang code:
  • <Body background = "file address"> ... </ body> At sa halip ng mga salitang "file address" ipasok ang landas sa larawan.
  • Gayunpaman, pansinin! Kung sa anyo ng background na gusto mong makita ang isang monochon canvas na tinukoy mula sa paleta ng kulay, pagkatapos ay tapos na ito gamit ang BGColor attribute. Halimbawa, ang <body bgcolor = "# 000000"> ... </ body>, tinanong namin ang isang itim na background para sa aming site.
  • Ang mga kulay sa CSS at HTML ay nakatakda sa pamamagitan ng isang salitang Ingles (halimbawa, pula), o isang espesyal na code na binubuo ng isang palatandaan # at anim na character pagkatapos nito (halimbawa, # FFDAB9). Kapag nag-type ng pangalawang pagpipilian sa mga espesyal na produkto ng software para sa mga developer, ang palette ay awtomatikong lilitaw sa harap mo. Kung sinimulan mo lamang ang pag-aaral ng mga wikang web na ito, maaaring i-spack ang code ng kulay sa Internet.

Background bilang ari-arian sa cascading estilo ng mga talahanayan Taas: 200%; :

Itinakda o sa isang hiwalay na file na may mga estilo ng CSS, o sa elemento ng <Style>. Gamit ang property na ito, maaari mong i-install ang mga pattern ng background o kulay, tukuyin ang panimulang lokasyon sa pahina, itakda ang mga paulit-ulit at nakapirming mga imahe. Para sa higit na kalinawan, gumawa ako ng mga kahulugan sa mesa. 

Mga parameter Layunin

Ginagamit upang mag-install ng isang nakapirming o scroll na imahe kasama ang nilalaman ng site. Nangyayari ang fixed, mag-scroll at magmana

Nagtatakda ng larawan sa background. Maaaring ito ay ipinahiwatig nang sabay-sabay sa kulay. Pagkatapos ay ipapakita ang huli hanggang sa ganap na na-load ang larawan.

Itinatakda ang unang lokasyon ng bagay para sa nakaraang parameter. Pahalang ay nagpapahiwatig ng tama, kaliwa at sentro, at patayo - ibaba, itaas at sentro. Bilang karagdagan, maaari mong magmana ng posisyon (magmana), itakda sa porsyento, pixel at iba pang mga sukat 

Ilapat kapag ginagamit ang attribute ng background-image. Regulates kung paano ang imahe ay paulit-ulit. Maaari mong tukuyin ang 2 halaga: para sa pahalang at vertical. May mga katangian: walang ulitin, ulitin, ulitin-x, ulitin-y, magmana, espasyo

Добавить комментарий