Kushandisa CSS Nezvifananidzo

Tora Zvidhori Zvako uye Shandisa Mifananidzo muTsika

Vanhu vazhinji vanoshandisa CSS kuti vagadzirise zvinyorwa, kuchinja faira, ruvara, ukuru uye zvimwe. Asi chimwe chinhu icho vanhu vakawanda vanowanzokanganwa ndechokuti iwe unogona kushandisa CSS nemifananidzo zvakare.

Kuchinja Chifananidzo Chako

CSS inokubvumira kugadzirisa kuti chifananidzo chinoratidza sei peji. Izvi zvinogona kubatsira chaizvo kuchengeta mapeji ako akafanana. Nokuisa mitambo pamifananidzo yose, unotarisa kutarisa mifananidzo yako. Zvimwe zvezvinhu zvaunogona kuita:

Kupa mufananidzo wako muganhu nzvimbo yakanaka kutanga. Asi iwe unofunga kufunga kupfuura kungova muganhu - funga pamusoro pemativi ose emufananidzo wako uye gadzirisa margins uye padding zvakare. Chifananidzo chine midzi mutsvuku mutsvuku chinoratidzika zvakanaka, asi kuwedzera pane padding pakati pomuganhu uye chifananidzo chinogona kutarisa zviri nani.

img {
Muganhu: 1px solid black;
padding: 5px;
}

Iyo pfungwa yakanaka nguva dzose kuisanidza mifananidzo isina kukora , kana zvichibvira. Asi paunenge uchiita, yeuka kuti mabheji akawanda anowedzera muganhu wakanga uchitenderera chifananidzo. Kunyange kana iwe ukashandisa nheyo yepamusoro ichi kuti uchinje muganhu, hukama huchapamhidzira kunze kwekuti iwe kana ukabvisa kana kuchinja muganhu pahutano pamwe chete. Kuti uite izvi iwe unofanira kushandisa mutemo wevana veCSS kuti ubvise kana kuchinja muganhu wakakomberedza mifananidzo yakabatana:

img> a {
border: none;
}

Iwe unogonawo kushandisa CSS kuti uchinje kana kuisa urefu nekufara kwemifananidzo yako. Kunyange zvazvo iyo isiri iyo pfungwa yekushandisa shanduro yekugadzirisa masikirwo emasikirwo nekuda kwekukurumidza kukurumidza, vari kuwana zviri nani pamifananidzo yekugarisa kuitira kuti vachiri kutarisa zvakanaka. Uye neCSS unogona kuisa mifananidzo yako kune vose kuva hupamhi hwepakati kana hurefu kana kunyange kutarisa zviyero kuti zvive nechokuenzanisa nesimbi.

Yeuka, iwe paunoshandura zvifananidzo, kuti uve nemigumisiro yakanakisisa, iwe unofanirwa kurongedza humwe humwe-hurefu kana hupamhi. Izvi zvichaita kuti chifananidzo chichengetedze chiyero chayo, uye saka hachina kutarisa chisingaoneki. Isa imwe yehutano kumotokari kana kuti iende nayo kunze kunoudza musikana kuti uchengetedze huwandu hwehuwandu hunoenderana.

img {
upamhi: 50%;
kureba: auto;
}

CSS3 inopa gadzirisa dambudziko iri neyezvinhu zvitsva-chinokodzera uye chinzvimbo-chinzvimbo. Nezvinhu izvi iwe uchakwanisa kutsanangura chaiyo mifananidzo yehupamhi uye upamhi uye kuti chiyero chezviyero chinofanira kushandiswa sei. Izvi zvinogona kuumba mabhii ebhizinesi mukati memifananidzo yako kana kubvongodza kuti mufananidzo ufanane nehukuru hunodikanwa.

Kunyange zvazvo CSS3 chinhu-chinokodzera uye chinzvimbo-nzvimbo-nzvimbo dzisingabatsiri zvakanyanya, zvakadaro pane zvimwe CSS3 zvinhu zvakanyatsotsigirwa muma browsers akawanda emazuva ano zvaungashandisa kugadzirisa mifananidzo yako. Zvinhu zvakadai semadonho emvura, makona akapoteredza, uye shanduko kuchinja, skew, kana kuti kutamisa mifananidzo yako yose inoshanda ikozvino mumavhuraji mazhinji emazuva ano. Iwe unogona kushandisa shanduko dzeCSS kuti zvifananidzo zvichinje kana zvichinyorwa pamusoro, kana kuti zvichinyorwa, kana kuti pashure penguva yakati.

Kushandisa Zvifananidzo Sezvakabva

CSS inoita kuti zvive nyore kusika mamiriro akasiyana nemifananidzo yako.

Iwe unogona kuwedzera mamiriro ega peji rese kana kuti pane chimwe chinhu chaicho. Zviri nyore kuumba chisikwa chemukati peji nechomufananidzo-chinyorwa cheimba:

muviri {
background-image: url (background.jpg);
}

Shandura musarudzo wemuviri pane chimwe chinhu chiri papeji kuitira kuisa mutsara pane imwechete chinhu.

Chimwe chinhu chinonakidza chaunogona kuita nemifananidzo inogadzira chinyorwa chemukati chisinganyori pamwe nezvose zvepeji - se watermark. Iwe unongoshandisa chimiro chemashure-chibatanidzwa: chakasimbiswa; pamwe nemufananidzo wako wemufananidzo. Zvimwe zvingasarudzwa pamitambo yako zvinosanganisira kuzviita tile chete zvishoma nezvishoma kana kutenderera uchishandisa nzvimbo-yekudzokorora pfuma.

Nyora shure-dzokorora: dzoka-x; kuti tile mufananidzo wacho nechokuno uye mhemberero-dzokorora: kudzokorora-y; kuti tile tete. Uye iwe unogona kuisa chimiro chako chemashure nechemberi-nzvimbo nzvimbo.

Uye CSS3 inowedzera mamwe maitiro emitambo yako zvakare. Unogona kutambanudza zvifananidzo zvako kuti zvikwanise chero hukuru hwemashure kana kuisa mufananidzo wekusimudza nekukura kwemahwindo . Iwe unogona kuchinja nzvimbo uye wozora chinyorwa chemufananidzo. Asi chimwe chezvinhu zvakanakisisa pamusoro peCSS3 ndechokuti iwe unokwanisa ikozvino kuisa mifananidzo yakawanda yemifananidzo kuti ugadzire zvimwe zvakaoma.

HTML5 Inobatsira Tema Images

Icho chirevo chemufananidzo mu HTML5 chinofanira kuiswa kumativi ose mapikicha anokwanisa kumira ari oga mukati mebhuku. Imwe nzira yekufunga nayo ndeyekuti chifananidzo chinogona kuonekwa mune chimwe chidimbu, saka chinofanira kunge chiri mukati meFIGURE element. Iwe unogona kushandisa sarudzo iyoyo uye chinhu cheFIGCAPTION kuti uwedzere mafashoni kumifananidzo yako.