Ipa iwe webhusaiti yako maonero aunofarira nechekuita mavara
Mifananidzo ndiyo chikamu chakakosha chekugadzirwa kwewebhu webusaiti. Izvi zvinosanganisira kushandiswa kwemifananidzo yakabva. Aya ndiwo mifananidzo nemifananidzo zvinoshandiswa kumashure kwepa peji kusiyana nezvifananidzo zvinowanikwa sechikamu chemaji anogadzirwa. Iyi mifananidzo yakawanda inogona kuwedzerwa kufarira peji uye kukubatsira kuti uwane zvisikwa zvaunogona kunge uri kutsvaga pane peji.
Kana iwe ukatanga kushanda nemifananidzo yakatarwa, hapana mubvunzo kuti iwe unopinda mumamiriro ezvinhu apo iwe unoda mufananidzo kutambanudza kuti ukwanise peji.
Izvi zvinonyanya kuitika kune mawebsite anobvuma ari kuendeswa kune zvakasiyana-siyana zvemajaira uye masikirwo emakona .
Ichi chido chekutarisa chimiro chemufananidzo ndicho chido chakakurumbira che web web designers nokuti haisi mifananidzo yose inowanikwa munzvimbo yewebsite. Panzvimbo yekuisa ukuru hwakatarwa, kutambanudza mufananidzo kunobvumira kuti ichinje kufanana nepeji pasinei nokuti yakareba sei kana yakaderera firiji rekushandura .
Nzira yakanakisisa yekuchera chifananidzo kuti ienderane nechemberi peji ndeyokushandisa pfuma yeCSS3 , nekuda kwemashure-hukuru. Heino muenzaniso unoshandisa chifananidzo chemukati chemuviri we peji uye unoisa uswa ku100% kuitira kuti ugare wakatambanudza kuti ukwanise skrini.
muviri {
mamiriro acho ezvinhu: url (bgimage.jpg) hakuna-repeat;
background-size: 100%;
}
Maererano neCaniuse.com, iyi pfuma inoshanda muIE 9+, Firefox 4+, Opera 10.5+, Safari 5+, Chrome 10.5+, uye pane dzose huru dzevashambadziri. Izvi zvinokufukidza iwe yese yezvinyorwa zvemazuva ano zviripo nhasi, izvo zvinoreva kuti iwe unofanira kushandisa imba iyi usingatyi kuti ichange isingashandisi pane chinyorwa cheumwe munhu.
Kuita Shanduko Yakanyatsotariswa muAkare Vakashambadziri
Hazvigoneki kuti iwe unoda kutsigira chero vashanduri vekare kupfuura IE9, asi ngatimbofungidzira kuti unonetseka kuti IE8 haitsigire iyi pfuma. Muchiitiko ichocho, iwe unogona kuisa rutivi rwakatambanudzwa. Uye iwe unogona kushandisa prefixes ye Browser 3.6 (-moz-background-size) uye Opera 10.0 (-o-background-size).
Nzira iri nyore yekunyengedza mifananidzo yakatambanudzwa ndeyekutambanudza iyo yose peji. Zvino iwe haugumi neimwe nzvimbo kana kuti unonetseka kuti rugwaro rwako rwunopinda munzvimbo yakatambanudzwa. Heino nzira yekuzviita nayo:
id = "bg" />
- Chokutanga, iva nechokwadi chokuti vese vesevhisi vane 100% yakakwirira, 0 margins, uye 0 padding pane uye HTML BODY elements. Isa zvinhu zvinotevera mumusoro wehurukuro yako ye HTML:
- Wedzera mufananidzo waunoda kuva wekutanga sechinhu chokutanga cheji yewebhu, uye upe id ye "bg":
- Isa nzvimbo yechiratidzo chemashure kuitira kuti igadziriswe kumusoro uye kuruboshwe uye iri 100% yakakura uye 100% murefu. Wedzera izvi pane yako faira pepa:
img # bg {
nzvimbo: yakasarudzwa;
kumusoro: 0;
Kuruboshwe: 0;
kureba: 100%;
kureba: 100%;
} - Wedzera zvose zviri mukati rako peji mukati meDIV chinhu neine "yehupenyu". Wedzera DIV pasi pemufananidzo:
Cherechedza: zvinonakidza kutarisa peji rako zvino. Mifananidzo inofanira kuratidzirwa, asi zvinyorwa zvako hazvisi zvachose. Sei? Nokuti chifananidzo chemashure chiri 100% muhupamhi, uye kupatsanurwa kwehupenyu kune mushure mechifananidzo mukuyerera kwebhuku - vheji vakawanda havazozviratidzi.Zvose zviripo pano - kusanganisira misoro, ndima, nezvimwe.
- Isa nzvimbo yako zvinyorwa kuitira kuti ive yakabatana uye iine z-index ye 1. Izvi zvichaunza pamusoro pemufananidzo wekunze mumagariro-zvinoenderana nemavhura. Wedzera izvi pane yako faira pepa:
#content {
nzvimbo: hama;
z-index: 1;
}
- Asi iwe hauna kuitwa. Internet Explorer 6 haisi mitemo inobvumirana uye ichiri nezvimwe zvinetso. Kune nzira dzakawanda dzekuvanza CSS kubva kune imwe shandura asi IE6, asi zvinoshandiswa (uye zvisingaiti kuti zvikonzere zvimwe zvinetso) kushandisa misimboti. Ita zvinotevera mushure mekunyora matepi ako mumusoro wechirongwa chako:
- Muchikamu chinonyatsotsanangurwa, wedzera imwe chidimbu chepepeti nemimwe michina kuti uwane IE 6 kutamba zvakanaka:
- Iva nechokwadi chekuedza muIE 7 uye IE 8 zvakare. Iwe unogona kunge uchida kugadzirisa zvinyorwa kuti uvatsigire ivo zvakare. Zvisinei, yakashanda pandakaiongorora.
Zvakanaka - izvi zvinobvumirwa kuti WAY zvinopfuura. Nzvimbo shoma dzakawanda dzinoda kutsigira IE 7 kana 8 zvakare, kunyanya IE6!
Sezvo zvakadaro, nzira iyi yakasimbiswa uye inenge isingadiwi kwauri. Ndinosiyira pano pano semuenzaniso wekuda kuziva nezvekuti zvinhu zvakaoma zvakadini vasati vashanduki vedu vose vakanyatsonaka pamwe chete!
Kuita Furati Yakanamirwa Yakananga Pamusoro Pechidiki Chenguva
Iwe unogona kushandisa nzira yakafanana kuti ureve mufananidzo wakatambanudzwa wakatarisana neDIV kana chimwe chinhu pane peji yako yewebhu. Izvi zvishoma zvishoma sezvaunofanirwa kushandiswa zvachose kana kuve nenhau dzisinganzwisisiki dzezvimwe zvikamu zvepaji rako.
- Isa chifananidzo pane peji randinofanira kushandisa semamiriro ekutanga.
- Mumutauro wepeji, sarudza hupamhi uye kukwirira kwechifananidzo. Cherechedza, iwe unogona kushandisa zvikamu zvehupamhi kana hurefu, asi ndinoona zviri nyore kurongeka nehurefu hutsika hwehurefu.
img # bg {
upamhi: 20em;
kureba: 30em;
} - Isa zvinhu zvako mu div ne id "content" sezvatakaita pamusoro apa:
Zvose zviripo pano
- Ita kuti zvinyorwa div zvive zvakaenzana nekukwirira sechifananidzo chemukati:
div # content {
upamhi: 20em;
kureba: 30em;
} - Zvadaro sarudza zvinyorwa kusvika kune imwechete yakakwirira semufananidzo. Saka kana mufananidzo wako uri 30em iwe unenge uine chimiro chepamusoro: -30m; Usakanganwa kuisa z-index ye1 pane zviri mukati.
#content {
nzvimbo: hama;
kumusoro: -30m;
z-index: 1;
upamhi: 20em;
kureba: 30em;
} - Zvadaro wedzera mu-z-index ye-1 yevashandi veIE 6, sezvawakaita pamusoro:
Zvakare, nehukuru-hukuru hunofarira musikana akawandisa kutsigira ikozvino, iyo nzira inogonawo kunge isingakoshi uye inowanikwa sechigadzirwa chekare. Kana iwe uchida kushandisa nzira iyi, ingova nechokwadi kuti uedze izvi mumavhuraji akawanda sezvaungaita.
Uye kana zvinhu zvako zvichishandura zvakakura, iwe unoda kuchinja hukuru hwegomba rako uye chimiro chemukati, zvisinei, iwe uchaguma nemigumisiro isingazivikanwi.