Pesapaiga: kuidas HTML muuta tausta pilt

Paljud uus kujundus, lihtsalt tundma südames luua saite, sageli ei tea, kuidas HTML muuta tausta pilt.Ja kui mõned neist võivad selle probleemi lahendamiseks, siis ikka tuleb probleeme venitada kogu laiust pilti monitorilt.Samas ma tahaks näha kohapeal kuvatakse kõik brauserid, nii et see peab vastama krossbrauzernosti.Teil on võimalik valida tausta kahel viisil: kasutades HTML sildid ja CSS stiile.Iga ise valib parima valiku.Muidugi, CSS on palju mugavam, sest kood on salvestatud eraldi faili ja ei võta extra esinejate peamine kohas sildid, kuid kõigepealt kaaluma lihtne meetod, millega taustapilti kohapeal.

HTML sildid luua tausta

Niisiis, minna küsimusele, kuidas muuta taustapilti html ekraanil.Et vaadata kaunis kohas, mida tuleb mõista pigem oluline detail: piisab lihtsalt teha gradient tausta või värviga värvida, aga kui soovite lisada pildi taustal, siis ei venitada kogu laiust monitor.Pilt oli algselt vaja kiirenemist või muuta oma disaini selle pikendamist, kus sa kuvab lehel.Ainult siis, kui taustapilt on valmis, asetage see kaust nimega «Images».Seal me salvestada kõik kasutatud pilte, animatsioone ja muid pildifaile.See kaust peaks olema juurkataloogi fail kõik oma html.Nüüd saate liikuda koodi.On mitmeid võimalusi salvestamiseks kood, mille muster muutub pilt.

  1. Write atribuut tag.
  2. kaudu CSS stiili HTML kood.
  3. Write CSS eraldi faili.

Kuidas HTML teeb taustapilti teil otsustada, kuid tahaksin öelda paar sõna selle kohta, kuidas oleks kõige optimaalsem.Esimene meetod on kirjutada läbi tag on juba ammu aegunud.Teine võimalus on kasutada väga harva, sest selgub, et palju sama koodi.Kolmas variant on kõige levinum ja tõhusam.Siin on HTML tag näited:

  1. esimene kirjendamise meetod läbi tag (keha) faili index.htm.See on kirjutatud sellisel kujul: (keha taust = "Nazvanie_papki / Nazvanie_kartinki.rasshirenie") (/ keha).See tähendab, et kui meil on pilt nimega «Pilt» ja laiendamine JPG ja kaust panime nimeks «Images», siis rekord HTML-koodi näeks välja selline: (keha taust = "Images / picture.JPG") ... (/ body).
  2. teine ​​meetod hõlmab salvestus CSS stiili, kuid on kirjutatud sama faili nimi index.htm.(keha style = "taust: url (" ../ Images / picture.JPG ")").
  3. Ja kolmas kirjendamise meetod on tehtud kaks faili.Dokument nimega index.htm tag (pea) on kirjutatud selline rida: (pea) (link rel = "laaditabeli" type = "text / css" href = "Put_k CSS_faylu") (/ head).Stiil faili nimega style.css juba kirjutada: keha {taust: url (Images / picture.JPG ")}.

Kuidas HTML teeb taustapilti arutasime.Nüüd tuleb välja selgitada, kuidas venitada pilt laiuti kogu ekraani.

meetodeid venitades tapeet laiuse akna

kujutada meie ekraanil protsendi kujul.Tuleb välja, et kogu pikkus ja laius ekraani on 100% x 100%.Meil on vaja venitada pildi laius.Lisa salvestada pilte style.css faili line, et venitada pilt kogu laiuse ja pikkuse monitor.Kuna see on kirjutatud oma CSS stiili?See on lihtne!

keha

{

taust: url (Images / picture.JPG ")

background-size: 100%;/ * See postitus sobib kõige kaasaegsete brauseritega * /

}

Nii et me saime teada, kuidas teha pilt tausta html ekraanil.Seal on meetod salvestades faili index.htm.Kuigi see meetod ja vananenud, kuid algajatele on vaja teada ja mõista.Silt (pea) (stiil) div {background-size: kate;} (/ Style) (/ pea), see rekord tähendab, et me eraldada eriüksus tausta, mis asetatakse üle kogu akna laiusele.Me kaalusime kaks võimalust teha veebilehte taustapilt html, pilt venitatakse kogu ekraani laiusest üheski kaasaegsete brauseritega.

Kuidas teha kindlaks tausta

Kui soovid kasutada pildi taustaks tulevik web ressurss, siis sa lihtsalt pead teadma, kuidas seda kindlaks, et see ei veni pikk ja ei riku esteetiline välimus.Lihtsalt kasutades HTML kood registreerima väike täiendus.Sa pead style.css faili lisada ühe lause pärast tausta: url (Images / picture.JPG ") fikseeritud;või selle asemel lisatakse semikooloniga eraldi rida - asukoht: fikseeritud.Seega, oma tapeet on fikseeritud.Ajal kerimine sisu koduleheküljel, näete, et teksti read liiguvad, kuid taust jääb püsima.Nii et sa õppinud, kuidas HTML muuta taustapilti, mitmeti.

töötada tabelitega HTML

Paljud kogenematud veebiarendajad silmitsi lauad ja üksused tihti ei saa aru, kuidas HTML tausta muuta pilti.Nagu kõik meeskonnad HTML ja CSS stiile, keel veebi programmeerimine on väga lihtne.Ja lahendus sellele probleemile on kirjutada paar rida koodi.Sa peaksid juba teadma, et kirjalikult tabeli read ja veerud vastavalt millele viitab silte (tr) ja (td).Et taustal tabeli kujul pilte, on vaja lisada tag (tabel), (tr) või (td) lihtne lause viitega pilt: taust = URL pildi.Selguse huvides anname mõned näited.

tabelid pildi tausta asemel: HTML näiteid

Joonista 2x3 laud ja teha seda taustapilti salvestatud kausta "Images": (tabel taust = "Images / picture.JPG") (tr) (td)1 (/ td) (td) 2 (/ td) (td) 3) (/ td) (/ tr) (tr) (td) 4 (/ td) (td) 5 (/ td) (td) 6 (/ td) (/ tr) (/ table).Nii et meie laua loositakse taustal pilti.

Nüüd juhtida sama plaat suurused 2x3, aga Pildi lisamine kolonni number 1, 4, 5 ja 6. (tabel) (tr) (td taust = "Images / picture.JPG") 1 (/ td)(td) 2 (/ td) (td) 3 (/ td) (/ tr) (tr) (td taust = "Images / picture.JPG") 4 (/ td) (td taust = "Images / picture.JPG") 5 (/ td) (td taust =" Images / picture.JPG ") 6 (/ td) (/ tr) (/ table).Pärast vaatame näen, et taustal tundub ainult need rakud, mis meil on registreeritud, kuid mitte kogu tabel.

piiriülese brauser saidilt

On olemas selline asi nagu piiriülese brauseri ühilduvuse web ressurss.See tähendab, et portaali lehtedel on sama hästi kuvatakse eri tüüpi ja versiooni brauseritega.See peaks olema HTML kood ja CSS kohandada stiilis nõutud brauseritega.Lisaks ajastul nutitelefonide, palju veebi arendajad üritavad luua saite, mis on kohandatud ja mobiilne versioon arvutisse ja vaata.