Mashandisiro Aungaita Mashoma CSS Makirasi Pamwechete Element

Iwe hausi uwandu kune imwe CSS kirasi yega yega.

Kushandura Mavara Sheetsiti (CSS) kukubvumira kutsanangura kuonekwa kwechinhu kuburikidza nekupinda mune zvaunofunga zvaunoshandisa pane ichocho. Izvi zvinogona kuva uye ID kana kirasi uye, semhando dzose, vanowedzera ruzivo rwakakosha kune zvinhu zvavanonamatirwa. Zvichienderana nemafungiro aunowedzera pane chimwe chinhu, unogona kunyora musarudzo weCSS kuti ushandise maitiro anodiwa anoonekwa anodiwa kuti uwane kutarisa uye kunzwa kwechikamu ichocho uye webhusaiti yakazara.

Kunyange zvazvo zivo kana makirasi ari kushanda nechinangwa chekuisa mukati mavo nemitemo yeCSS, mazuva ano web design nzira dzinobatsira makirasi pamusoro peAIDS, muchikamu, nokuti haasati yakanyatsojeka uye zviri nyore kushanda pamwe chete. Hungu, iwe uchange uchitora nzvimbo dzakawanda dzinoshandisa maAIDS, asi izvo zvimiridzo zviri kushandiswa zvishoma kudarika munguva yakapfuura apo makirasi atora mapeji emazuva ano.

Chikoro chimwe chete kana zvakawanda muCSS?

Muzviitiko zvakawanda iwe unogona kupa imwe chikwata chekirasi kune chimwe chinhu, asi iwe chaizvoizvo hausi weklasi imwe chete ivo nenzira iyo iwe une ID. Kunyange zvazvo chinhu chinogona kungova nehumwe hutano hunozivikanwa, unokwanisa zvachose kupa chimwe chinhu chezvikoro uye, mune dzimwe nguva, kuita izvozvo kuchaita kuti peji rako rive nyore kutarisa uye zvimwe zvinogadziriswa!

Kana uchida kugovera makirasi akawanda kune chimwe chinhu, unogona kuwedzera zvidzidzo zvakare uye uzvisiyanise nechinzvimbo mumutauro wako.

Somuenzaniso, iyi ndima ine makirasi matatu:

pullquote inonzi yakasara kuruboshwe "> Iyi ndiyo inenge yakanyorwa yendima

Izvi zvinodzidzisa zvikamu zvitatu zvinotevera pane ndima tag:

  • Pullquote
  • Yakaiswa
  • Ruboshwe

Cherechedzai nzvimbo dziri pakati peimwe yeikirasi inokosha. Nzvimbo iyo ndiyo inovaisa sevakasiyana, makirasi evanhu. Ichi ndicho chikonzero nei mazita ekirasi asingakwanisi kuva nezvivako mavari, nokuti kuita izvozvo kungavaisa sezvikamu zvakasiyana.

Somuenzaniso, kana iwe wakashandisa "pullquote-featured-kuruboshwe" pasina nzvimbo, ingadai iri imwe yeklasi yakakosha, asi muenzaniso uri pamusoro, apo mashoko matatu aya akaparadzaniswa neszvimbo, anovaisa semunhu anokosha. Zvakakosha kunzwisisa chirevo ichi sezvo iwe uchisarudza kuti chidzidzo chei chikoro chaunoshandisa kushandisa pawebhu yako.

Kana uchinge wava nekirasi yako inokosha mu HTML, unogona kugovera aya semakirasi muCSS yako uye shandisa maitiro iwe waunoda kuwedzera. Semuyenzaniso.

.pullquote {...}
.featured {...}
p.left {...}

Mune mienzaniso iyi, kuzivisa kweCSS uye hutano hwepamusoro hwaizova mukati memakumbo ekudzivirira, iyo ndiyo nzira iyo michina yaizoshandiswa kumusarudzo akakodzera.

Cherechedza - kana iwe ukaisa kirasi kune chimwe chinhu (semuenzaniso, p.left), iwe unogona kuchishandisa sechikamu chendandema yemakirasi; zvisinei, ziva kuti zvinongogadzirisa zvinhu izvo zvakataurwa muCSS. Mune mamwe mazwi, p.left style inongoshanda chete kumapapu neyikirasi kubva pakusarudza wako ari kutaura kuti kuishandisa kune "ndima nematongerwo ekirasi ye" kuruboshwe "". Kusiyana neizvi, vamwe vasarudzo vaviri mumuenzaniso havatauri chimwe chinhu, saka vanozoshanda pane chero chinhu chinoshandisa izvo zvidzidzo zvekirasi.

Kubatsirwa Kwemakirasi Akawanda

Zvidzidzo zvakawanda zvinogona kuita kuti zvive nyore kuwedzera zvakakosha zvinokonzera kune zvinhu kunze kwekuti iwe ugadzire chimiro chitsva chechikamu ichocho.

Somuenzaniso, iwe unogona kuva nekwanisi yekukwira zvinhu kune kuruboshwe kana kurudyi nekukurumidza. Iwe unogona kunyora makirasi maviri akasiyiwa uye akarurama ne kungofamba-famba: kuruboshwe; uye svetuka: kurudyi; mukati mavo. Zvadaro, pose pawakanga uri nechikamu unofanirwa kutenderera kuruboshwe, iwe unongowedzera kirasi "kuruboshwe" kukirasi yekirasi yacho.

Pane mutsara wakaisvonaka wokufamba pano, zvakadaro. Yeuka kuti webhutori yemitemo inoratidzira kuparadzana kwemaitiro uye chimiro. Chimiro chinoshandiswa kuburikidza ne HTML apo chimiro chiri muCSS.

Kana tsamba yako ye HTML yakazadzwa nezvinhu izvo vose vane mazita ekirasi se "red" kana "kuruboshwe", ayo mazita anotsanangura kuti zvinhu zvinofanira kutarisa pane zvavari, uri kuyambuka mutsetse iwoyo pakati pechimiro uye chimiro. Ndinoedza kuderedza mazita angu asiri mashetictic mazita akawanda zvakakwanisa nokuda kwechikonzero ichi.

Makirasi Akawanda, Semantics, uye JavaScript

Rimwe ruzivo pakushandisa makirasi akawanda nderokuti rinokupa mamwe maitiro akawanda ekugadzirisa.

Iwe unogona kushandisa zvidzidzo zvitsva kune zvimwe zviripo zvinoshandisa JavaScript pasina kubvisa chero chekutanga makirasi. Iwe unogonawo kushandisa makirasi kuti ujekese semantics yechinhu . Izvi zvinoreva kuti iwe unogona kuwedzera pazvikwata zvinowedzera kuti ujekese kuti icho icho chinoreva chidimbu. Iyi ndiyo nzira iyo Microformats inoshanda.

Kukanganisa Kwemakirasi Akawanda

Chinyanya kukanganisa kushandisa makirasi akawanda pazvinhu zvako ndezvokuti zvinogona kuita kuti zvisava nyore kutarisa uye kutarisira kwenguva. Zvinogona kuva zvakaoma kuziva kuti michina ipi inobata chinhu uye kana chero magwaro ezvinyorwa ari kuipa. Zvizhinji zvezvigadziriro zviripo nhasi, saBootstrap, zvinoshandiswa zvakanyanya zvezvinhu zvine makero akawanda. Nhamba iyoyo inogona kubva kunze uye yakaoma kushanda nekukurumidza zvikuru kana iwe usingachenjeri.

Paunoshandisa makirasi akawanda, iwe unomhanyawo mukana wekuita kuti chikwata chekirasi imwe chiwedzere chimiro cheumwe kana kunyange iwe usina kutarisira izvi. Izvi zvinogona kuita kuti zvive zvakaoma kuziva kuti sei micheka yako isiri kushandiswa kunyange kana ichiita seinofanira.

Iwe unofanirwa kuziva zviri pachena, kunyange nemafungiro anoshandiswa kune icho chimwe chinhu!

Nokushandisa shanduro yakafanana nemashandisi eWebmaster muChrome, unogona kuona nyore nyore kuti mapoka ako ari kuchinja sei maitiro ako uye kudzivisa dambudziko iri rekupesana nemafungiro nemafungiro.

Nyaya yekutanga naJennifer Krynin. Yakarongedzwa naJeremy Girard musi we8 / 7/17