Indawo oluzalela: ukwenza indlela umfanekiso wesiqalo html

abayili abaninzi web mafikizolo, kuphela lokuhlolisisa kakuhle ekudalweni kweendawo, badla bayazibuza ukwenza umfanekiso html ongasemva. Ke ukuba inxenye kubo ukujongana nale ngxaki, kusenjalo ingxaki ngexesha ndisolulela yonke ububanzi bomfanekiso esweni. Ngelo xesha Ndingathanda ukubona site eboniswe ukukhetha kuzo zonke izikhangeli, ngoko ke kufuneka ukuzalisekisa iimfuno lomnqamlezo-browser. Uyakwazi ukucwangcisa imvelaphi ngeendlela ezimbini: ngokusebenzisa tag HTML kunye nezimbo CSS. Ngasinye ngokuba yena akhetha ndlela ilungileyo. Kakade ke, style CSS Kulula kakhulu ngakumbi, kuba ikhowudi yayo igcinwe kwifayile esecaleni kwaye Nongawuthabathiyo izithethi chatha tags isiza engundoqo, kodwa kuqala makhe siqwalasele indlela elula ukufaka umfanekiso kwisiqalo wesiza.

HTML tag Basic ukudala yangasemva

Ngoko ke, siye kumbuzo ye indlela yokwenza umfanekiso ongasemva in html kwi kwikhusi. Ukuze khangela site ezintle, kufuneka uqonde enye inkcukacha kunokuba ebalulekileyo: kwanele nje ukwenza imvelaphi ithambeka okanye ulipeyinte indawo umbala ongqindilili, kodwa ukuba ufuna ukufaka umfanekiso ngasemva, akuyi kusolula ububanzi ngokupheleleyo esweni. Lo mfanekiso ekuqaleni kuyimfuneko xa kukhweliswa okanye ukwenza uyilo lakho le ulwandiso, apho uya ukubonisa iphepha le sayithi. Kuphela xa umfanekiso wesiqalo ngulo ukulungele, tsala yona ibe kwifolda ebizwa «Imifanekiso». Kuyo, siza kugcina yonke imifanekiso babesebenzisa, animations nezinye iifayile graphic. Le ncwadi eneenkcukacha kufuneka ibekwe weefayili iingcambu zonke iifayile zakho html. Ngoku ungahambisa kwi kunye nekhowudi. Kukho iinketho eziliqela ikhowudi yokubhala, apho kwisiqalo ukutshintsha umfanekiso.

1. Bhala tag ngemfanelo.
2. Ngenxa CSS isimbo kwi khowudi HTML.
3. Bhala izimbo CSS kwifayile eyahlukileyo.

Njengoko kwi HTML ukwenza umfanekiso ongasemva, nina isigqibo, kodwa ndingathanda ukuthetha amazwi ambalwa malunga nendlela bekuya kuba kakhulu kangangoko. Indlela yokuqala ngokubhala ngokusebenzisa lesiphumo tag kukade icangcisiwe lixesha. Le ukhetho yesibini isetyenziswa kunqabile kakhulu, kuba kwenzeka ukuba iqashiso ikhowudi efanayo. A ukhetho yesithathu eqhelekileyo kakhulu nolusebenzayo. Nantsi imizekelo tags HTML:

1. Indlela yokurekhoda lokuqala tag attribute (body) kwifayile index.htm. Igcinwe kule fom: (background umzimba = "FOLDER_NAME / Nazvanie_kartinki.rasshirenie") (/ omzimba). Oko kukuthi, ukuba sibe umfanekiso nesihloko «Umfanekiso» nokwandiswa JPG, kunye nefowulda igama elithi «Imifanekiso», ngoko ke entry HTML-ikhowudi iza kukhangeleka ngolu hlobo: (background umzimba = "Images / Picture.jpg") ... (/ umzimba) .
2. Indlela yesibini ibandakanya urekhoda isimbo CSS, kodwa kubhaliweyo yifayile enye onegama index.htm. (Body style = "imvelaphi: url ( 'Images ../ / Picture.jpg')").
3. Indlela yesithathu ushicilelo senziwe iifayile ezimbini. Olu xwebhu ne tag igama index.htm (intloko) ibhalwe umgca hlobo: (intloko) (link rel = "ikhasi lohlobo" type = "umbhalo / CSS" href = "http: // site / inqaku / 193110 /% D0% 9F % D1% 83% D1% 82% D1% 8C_% D0% BA CSS_faylu ") (/ intloko). A kwifayile ebizwa nge style style.css sele bhala: umzimba {imvelaphi: url (Images / Picture.jpg ')}.

Njengoko kwi HTML ukwenza umfanekiso ongasemva, siyaqonda. Ngoku kufuneka sijonge phandle ukuba olule indlela umfanekiso ngapha kobubanzi sonke iskrini.

Iindlela olule umfanekiso imvelaphi ububanzi window

Simela screen yethu ngokohlobo njengepesenti. Kubonakala ukuba wonke ububanzi nobude khusi kuba 100% × 100%. Kufuneka ukuba olule umfanekiso kule ububanzi. Faka umfanekiso kwifayile ukurekhodwa style.css line ukuba olule umfanekiso phezu lonke ububanzi kunye nobude esweni. Njengokuba kubhaliwe kwathiwa ezinintsi CSS? Yinto elula!

umzimba

{

imvelaphi: url (Images / Picture.jpg ')

imvelaphi-size: 100%; / * Esi sithuba ikufanele abaninzi kubakhangeli zincwadi abasetyenziswayo * /

}

Ngoko ke ndicinge ukuba ukwenza njani isiqalo nomfanekiso html kwi kwikhusi. Kukho kwakhona indlela zokurekhodisha kwifayile index.htm. Nangona le ndlela kwaye eziphelelwe lixesha, kodwa kwabasaqalayo kuyimfuneko ukwazi nokuqonda. Ithegi (intloko) (style) div {imvelaphi-size: inshorensi; } (/ Style) (/ intloko), le rekhodi kuthetha ukuba anikezele iyunithi eyodwa kwikhusi, nto leyo iya kuthi ibekwe phezu lonke ububanzi window. Siye sahlolisisa iindlela ezimbini, ukuze enze indlela html site umfanekiso ongemva, khon 'ukuze lo mfanekiso ze bulukwe ukuba yonke ububanzi lomkhusane nayiphi na kubakhangeli zincwadi abasetyenziswayo.

Indlela yokwenza yangasemva esisigxina

Ukuba ukhetha ukusebenzisa umfanekiso njengoko imvelaphi lwemvelaphi web elizayo, ngoko ke kufuneka nje ukwazi ukwenza it nquma ngayo, kangangokuba akukho bulukwe ubude yaye abazange ezonakalisa imbonakalo kubuhle. Nje ngokusebenzisa ikhowudi HTML ukubhalisa Ngaphezu encinane. Kufuneka kwifayile style.css ukudibanisa ibinzana emva imvelaphi: url (Images / Picture.jpg ') ezisisigxina; okanye endaweni yongezwe emva kokuba semicolon umgca eyahlukileyo - indawo: ezisisigxina. Ngenxa yoko, lodonga yakho iya ezisisigxina. Ngexesha ebonakalayo Umxholo kwisiza, uya kubona ukuba itekisi imigca kuzinambuzane, kodwa imvelaphi lema endaweni. Ngoko wafunda ukwenza umfanekiso ongasemva html, ngeendlela ezininzi.

Ukusebenza Tables e HTML

Abaninzi ababhekisi web ongenamava, ezijongene iitafile neebhloko, abadli bengaqondi ukuba ukwenza njani itheyibhile html umfanekiso ongasemva. Njengabo bonke amaqela HTML iindlela kunye CSS, ulwimi web udweliso yi ibonakala ngcono. Kwaye ke isisombululo sale ngxaki kukuba ukubhala iperi imigca khowudi. Kufuneka sele uyazi ukuba ukubhala itafile lwemiqolo nemihlathi, ngokulandelelana, njengoko kuboniswe tags (ts) kunye (TD). Ukwenza imvelaphi itafile uhlobo lomfanekiso, kuyimfuneko ukongeza ithegi (table), (ts) okanye (TD) ibinzana elula ngokubhekisele kumfanekiso imbekiselo: imvelaphi = imifanekiso URL. Ecacileyo, sinikela isibini imizekelo.

Uluhlu umfanekiso endaweni ngasemva: imizekelo HTML

Zoba itheyibhile 2x3 kwaye wenze umfanekiso ongasemva ezigcinwe kwifowulda "Imifanekiso": (background itafile = "Images / Picture.jpg") (ts) (TD) 1 (/ TD) (TD) 2 (/ TD) (TD) 3) (/ TD) (/ ts) (ts) (TD) 4 (/ TD) (TD) 5 (/ TD) (TD) 6 (/ TD) (/ ts) (/ itheyibhile). Ngoko ke itafile iya elingatsalanga ngasemva kulo mfanekiso.

Ngoku zoba ubukhulu kwipleyiti enye ye 2x3, kodwa ufake umfanekiso kwiikholam ababalwayo 1, 4, 5 no 6. (table) (ts) (background TD = "Images / Picture.jpg") 1 (/ TD) (TD) 2 (/ TD) (TD) 3 (/ TD) (/ ts) (ts) (TD ngasemva = "Images / Picture.jpg") 4 (/ TD) (TD ngasemva = "Images / Picture.jpg") 5 ( / TD) (TD ngasemva = "Images / Picture.jpg") 6 (/ TD) (/ ts) (/ itheyibhile). Emva kokubukela siyakwazi ukubona ukuba imvelaphi ibonakala kuphela ezo seli ngazo abhalisiweyo, kwaye yonke itafile.

site ehambelanayo Cross-browser

Kukho into enje njenge cross-ibhrawuza ukuhambelana web resource. Oku kuthetha ukuba isayithi yakho ngokulinganayo kubonakaliswa kakuhle kwiintlobo ezahlukeneyo kunye iinguqulelo ze bakhangeli beencwadi. Kufuneka ibe HTML ikhowudi kunye CSS styles ukuba ngokusesikweni bakhangeli beencwadi kuyimfuneko. Ngaphezu koko, ngexesha mihla smart phones, abaphuhlisi web abaninzi bazama ukudala iindawo yaye lulungiselelwe yeselula kunye look computer.