Safle nythu: sut i wneud y llun cefndir html

Mae llawer o ddylunwyr gwe newyddian, dim ond i ymchwilio i hanfod y safleoedd creu, yn aml yn meddwl tybed sut i wneud delwedd gefndir html. Ac os gall rhai ohonynt ddelio â'r broblem hon, mae'n dal i fod yn broblem ar adeg ymestyn y lled cyfan y ddelwedd ar y monitor. Ar yr un pryd, hoffwn weld y safle yn cael eu harddangos yn union ar yr holl borwyr, felly dylai fod yn cyflawni gofynion traws-porwr. Gallwch osod y cefndir mewn dwy ffordd: drwy ddefnyddio tagiau HTML ac arddulliau CSS. Mae pob un ar gyfer ei hun yn dewis yr opsiwn gorau. Wrth gwrs, arddull CSS yn llawer mwy cyfleus, oherwydd bod ei cod yn cael ei storio mewn ffeil ar wahân ac nid yw'n cymryd siaradwyr ychwanegol yn tagiau y prif safle, ond yn gyntaf gadewch i ni ystyried dull syml ar gyfer gosod y ddelwedd ar gefndir y safle.

tagiau HTML Sylfaenol i greu'r cefndir

Felly, rydym yn mynd i'r cwestiwn o sut i wneud y ddelwedd cefndir mewn html ar y sgrin. Er mwyn edrych safle hardd, mae'n rhaid i chi ddeall un manylyn yn hytrach bwysig: mae'n ddigon i wneud cefndir graddiant neu baentio lliw solet, ond os bydd angen i mewnosoder y ddelwedd cefndir, ni fydd yn ymestyn y lled llawn y monitor. Mae'r ddelwedd yn wreiddiol yn angenrheidiol i godi neu wneud eich dyluniad eich hun gyda'r estyniad hwn, lle byddwch yn arddangos dudalen y wefan. Dim ond pan fydd y ddelwedd cefndir yn barod, lusgo i mewn ffolder o'r enw «Delweddau». Ynddo, byddwn yn storio'r holl ddelweddau a ddefnyddir, animeiddiadau a ffeiliau graffig eraill. Dylai'r ffolder yn cael ei lleoli yn y cyfeiriadur gwraidd gyda'ch holl ffeiliau html. Nawr gallwch symud ymlaen ac i'r cod. Mae nifer o opsiynau ar gyfer ysgrifennu cod, y bydd y cefndir yn newid y llun.

1. Ysgrifennwch priodoledd tag.
2. Trwy arddull CSS yn y cod HTML.
3. Ysgrifennwch arddulliau CSS mewn ffeil ar wahân.

Fel yn y HTML i wneud y ddelwedd cefndir, byddwch yn penderfynu, ond hoffwn ddweud ychydig eiriau am sut y byddai'n fod y rhai mwyaf gorau posibl. Y dull cyntaf yw trwy ysgrifennu drwy priodoledd tag wedi bod yn darfod hir. Yr ail opsiwn yn cael ei ddefnyddio yn anaml iawn, gan ei fod yn troi allan bod llawer o'r un cod. Mae trydydd opsiwn yw'r mwyaf cyffredin ac effeithiol. Dyma enghreifftiau o dagiau HTML:

1. Mae'r dull o gofnodi gyntaf drwy priodoledd tag (corff) yn y ffeil index.htm. Mae'n cael ei storio yn y ffurflen hon: (cefndir corff = "FOLDER_NAME / Nazvanie_kartinki.rasshirenie") (/ corff). Hynny yw, os oes gennym ddarlun gyda'r teitl «Picture» ac estyniad JPG, ac mae'r folder rydym enwir «Delweddau», yna bydd y cofnod HTML-god yn edrych fel hyn: (cefndir corff = "Delweddau / Picture.jpg") ... (/ corff) .
2. Yr ail ddull yn golygu cofnodi arddull CSS, ond y mae yn ysgrifenedig yn yr un ffeil gyda'r enw index.htm. (Corff arddull = "cefndir: url ( 'Delweddau ../ / Picture.jpg')").
3. Y trydydd dull o gofnodi yn cael ei wneud mewn dau ffeiliau. Mae'r ddogfen gyda'r tag enw index.htm (pen) ei ysgrifennu llinell o'r fath: (pen) (dolen rel = fath "arddull" = "text / css" href = "http: // safle / erthygl / 193,110 /% D0% 9F % D1% 83% D1% 82% D1% 8C_% D0% BA CSS_faylu ") (/ pen). Mae arddull style.css ffeil o'r enw eisoes yn ysgrifennu: corff {cefndir: url (Delweddau / Picture.jpg ')}.

Fel yn y HTML i wneud y ddelwedd cefndir, rydym yn deall. Nawr mae angen i chi chyfrif i maes sut i ymestyn y ddelwedd ar draws lled y sgrin gyfan.

Ffyrdd o ymestyn y ddelwedd cefndir lled y ffenestr

Rydym yn cynrychioli ein sgrin ar ffurf canran. Mae'n troi allan y bydd y lled cyfan a hyd y sgrin fod yn 100% × 100%. Mae angen i ni ymestyn y lun er mwyn lled hwn. Ychwanegu at y llinell cofnodi style.css ffeil delwedd a fydd yn ymestyn y ddelwedd dros y lled cyfan a hyd y monitor. Fel y mae'n ysgrifenedig yn arddull CSS? Mae'n syml â hynny!

corff

{

cefndir: url (Delweddau / Picture.jpg ')

cefndir-size: 100%; / * Mae'r swydd hon yn addas ar gyfer y rhan fwyaf o borwyr modern * /

}

Felly, rydym yn cyfrifedig gwybod sut i wneud cefndir llun yn html ar y sgrin. Mae yna hefyd ddull o gofnodi yn y ffeil index.htm. Er bod y dull hwn ac wedi dyddio, ond ar gyfer dechreuwyr mae angen ei wybod a'i ddeall. Mae'r tag (pen) (arddull) div {cefndir-size: clawr; } (/ Style) (/ pen), y cofnod hwn yn golygu ein bod yn dyrannu uned arbennig ar gyfer y cefndir, a fydd yn cael eu lleoli dros y lled cyfan y ffenestr. Rydym wedi ystyried dwy ffordd, sut i wneud safle html llun cefndir, fel bod y ddelwedd yn cael ei hymestyn i'r lled cyfan y sgrin mewn unrhyw un o'r porwyr modern.

Sut i wneud gefndir sefydlog

Os byddwch yn penderfynu defnyddio llun fel cefndir yr adnodd ar y we yn y dyfodol, yna dim ond angen i chi wybod sut i wneud yn sefydlog, fel nad yw'n cael ei ymestyn o hyd ac nid oedd yn difetha golwg esthetig. Yn syml, drwy ddefnyddio cod HTML i gofrestru ychwanegiad bach. Mae angen i chi ffeilio style.css i ychwanegu ymadrodd ôl cefndir: url (Delweddau / Picture.jpg ') sefydlog; neu yn lle hynny eu hychwanegu ar ôl y colon linell ar wahân - sefyllfa: sefydlog. Felly, bydd eich papur wal fod yn sefydlog. Yn ystod y sgrolio gynnwys ar y safle, byddwch yn gweld bod y testun llinellau yn symud, ond mae'r cefndir yn parhau i fod yn ei le. Felly, rydych wedi dysgu sut i wneud delwedd gefndir html, mewn sawl ffordd.

Gweithio gyda Tablau yn HTML

Mae nifer o ddatblygwyr gwe dibrofiad, wynebu byrddau a blociau, yn aml nid ydynt yn deall sut i wneud bwrdd cefndir ddelwedd html. Fel pob tîm HTML arddulliau a CSS, iaith raglennu we yn weddol syml. A'r ateb i'r broblem hon yw ysgrifennu pâr o linellau o god. Dylech eisoes yn gwybod bod ysgrifennu tabl o resi a cholofnau, yn y drefn honno, fel y nodir gan y tagiau (tr) a (td). I wneud y cefndir y tabl ar ffurf delwedd, mae angen i ychwanegu at y tag (tabl), (tr) neu (td) brawddeg syml gan gyfeirio at y llun cyfeirio: cefndir = lluniau URL. Er mwyn eglurder, rydym yn rhoi cwpl o enghreifftiau.

Tabl gyda llun yn lle y cefndir: Enghreifftiau HTML

Lluniwch dabl 2x3 a'i wneud yn y ddelwedd cefndir ei storio yn y ffolder "Delweddau": (cefndir tabl = "Delweddau / Picture.jpg") (tr) (td) 1 (/ td) (td) 2 (/ td) (TD) 3) (/ td) (/ tr) (tr) (td) 4 (/ td) (td) 5 (/ td) (td) 6 (/ td) (/ tr) (/ tabl). Felly, bydd ein bwrdd yn cael ei lunio yn y cefndir y llun.

Nawr yn tynnu yr un maint plât o 2x3, ond rhowch llun yn y colofnau rhifo 1, 4, 5 a 6. (tabl) (tr) (cefndir td = "Delweddau / Picture.jpg") 1 (/ td) (TD) 2 (/ td) (td) 3 (/ td) (/ tr) (tr) (cefndir td = "Delweddau / Picture.jpg") 4 (/ td) (cefndir td = "Delweddau / Picture.jpg") 5 ( / td) (cefndir td = "Delweddau / Picture.jpg") 6 (/ td) (/ tr) (/ tabl). Ar ôl gwylio gallwn weld bod y cefndir yn ymddangos yn unig yn y celloedd y rhai yr ydym yn cofrestru, ac nid y bwrdd cyfan.

Safle cydweddoldeb traws-porwr

Mae y fath beth fel adnodd ar y we cydweddoldeb traws-porwr. Mae hyn yn golygu bod eich safle yn cael ei harddangos yn dda yn gyfartal mewn gwahanol fathau a fersiynau o borwyr. Dylai fod yn cod HTML a CSS arddulliau addasu o borwyr angenrheidiol. Ar ben hynny, yn y cyfnod modern o ffonau smart, llawer o ddatblygwyr gwe yn ceisio creu safleoedd ac addasu ar gyfer fersiwn symudol a golwg cyfrifiadurol.