Maphunziro ndi Zithunzi Thandizo Lonjezani CSS Yanu
Kumanga mawebusaiti pa webusaiti yathu lero kumafuna kumvetsetsa kwambiri kwa CSS (Zomwe Zimasintha Mafilimu). Awa ndiwo malangizo omwe mumapatsa webusaitiyi kuti mudziwe momwe zidzakhalire muwindo la osatsegula. Mumagwiritsa ntchito mndandanda wa "mafashoni" ku chilemba chanu cha HTML chimene chidzawoneka ndi kumverera tsamba lanu lazamasamba.
Pali njira zambiri zomwe mungagwiritsire ntchito mafashoni omwe tawatchula pamwamba pazomwe mukulemba, koma nthawi zambiri mukufuna kugwiritsa ntchito kalembedwe pazinthu zina zokhazokha, koma osati zochitika zonse za chigawochi.
Mwinanso mungapange kalembedwe yomwe mungagwiritse ntchito pazinthu zingapo m'datayi, popanda kubwereza lamulo lachikhalidwe kwa wina aliyense. Kuti mukwaniritse zojambulazi zofunidwazi, mutha kugwiritsa ntchito zida za HTML ndi kalasi. Makhalidwe amenewa ndi zizindikiro zapadziko lonse zomwe zingagwiritsidwe ntchito pafupifupi mtundu uliwonse wa HTML. Izi zikutanthauza kuti ngati muli ndi mapepala, magawo, zizindikiro, mndandanda kapena zigawo zina za HTML muzomwe mukulemba, mukhoza kutembenukira ku zigawo za ID kukuthandizani kukwaniritsa ntchitoyi!
Selections Selections
Ophunzira m'kalasi amakulolani kuti muyike mafashoni angapo ku chinthu chimodzi kapena chilembo chomwecho. Mwachitsanzo, mungafune kukhala ndi magawo ena a malemba anu omwe amatchulidwa mu mtundu wosiyana kuchokera pazolembedwa zonsezo. Zigawidwe izi zikhoza kukhala "tcheru" zomwe mukuyika pa tsamba. Mungapereke ndime yanu ndi makalasi onga awa:
p {mtundu: # 0000ff; }}
p.alert {mtundu: # ff0000; }}
Mitambo iyi ikanaika mtundu wa ndime zonse ku buluu (# 0000ff), koma ndime iliyonse ndi chikhalidwe cha "chidziwitso" chingakhale ndi zolembera zofiira (# ff0000). Izi ndizo chifukwa chikhalidwe cha m'kalasi chiri ndipamwamba kwambiri kuposa ulamuliro woyamba wa CSS, umene umagwiritsira ntchito kagawo kokha.
Pogwira ntchito ndi CSS, malamulo ena enieni adzakula pang'ono. Kotero, mu chitsanzo ichi, malamulo omwe amachititsa kuti awononge mtundu wonse wa ndime, koma lamulo lachiwiri, lachindunji kuposa momwe likukhalira pa ndime zina zokha.
Pano pali momwe mungagwiritsire ntchito izi palimodzi la HTML:
Ndime iyi idzawonetsedwa mu buluu, yomwe ili yosasintha pa tsamba.
Gawoli likanakhalanso ndi buluu.
Ndipo ndimeyi idzawonetsedwa mufiira chifukwa chidziwitso cha m'kalasi chidzadutsa mtundu wa buluu wochokera ku chosankha chojambula.
Mu chitsanzochi, kalembedwe ka "p.alert" ingagwiritsidwe ntchito pa ndime zomwe zimagwiritsa ntchito gulu "lodziwitsidwa". Ngati mukufuna kugwiritsa ntchito kalasiyi pamadongosolo osiyanasiyana a HTML, mungangotulutsa zotsatira za HTML kuyambira pachiyambi cha kuyitanira mafashoni (onetsetsani kuti mukuchoka nthawi (.) m'malo), monga chonchi:
.alert {zojambula: # ff0000;}}
Kalasiyi tsopano ilipo kwa chinthu chilichonse chimene chikufunikira. Chigawo chilichonse cha HTML yanu chomwe chili ndi chiwerengero cha "kuchenjeza" tsopano chipeza kalembedwe kake. Mu HTML pansipa, tili ndi ndime ndi mutu wa 2 omwe amagwiritsa ntchito gulu "tcheru". Zonsezi zimakhala ndi mtundu wofiira wochokera ku CSS yomwe tangoonetsa.
Ndimeyi idalembedwa mofiira.
Ndipo h2 iyi idzakhala yofiira.
Pa webusaiti lero, zikhumbo za m'kalasi zimagwiritsidwa ntchito pazinthu zambiri chifukwa zimakhala zosavuta kugwira ntchito kuchokera kumalingaliro enieni omwe ID ali. Mudzapeza masamba ambiri a HTML omwe angakwaniritsidwe ndi zilembo zamagulu, zomwe zinalembedwa mobwerezabwereza m'kalembedwe ndi zina zomwe zingawoneke kamodzi.
Zosankha za ID
Chosankha cha ID chimakupatsani inu kupatsa dzina ku kachitidwe kokha popanda kugwirizanitsa ndi chiganizo kapena chinthu china cha HTML . Nenani kuti muli ndi magawano muzomwe muli HTML zomwe zili ndi chidziwitso chochitika.
Mungapereke gawo ili chizindikiro cha "chiwonetsero", ndiyeno ngati mukufuna kufotokoza magawanowa ndi malire a 1-pixel wakuda wakuda kulemba chikhombo cha ID:
#event {malire}: 1px olimba # 000; }}
Chovuta ndi osankhidwa a ID ndikuti sangathe kubwerezedwa muzokambirana ya HTML. Ayenera kukhala apadera (mungagwiritse ntchito chidziwitso chomwecho pamasamba angapo a tsamba lanu, koma kamodzi pazokambirana za HTML). Kotero ngati mutakhala ndi zochitika 3 zomwe zimafunikira malire awa, mungafunike kuwapatsa zizindikiro za "event1", "event2" ndi "event3" ndi kalembedwe aliyense. Choncho, zikanakhala zophweka kwambiri kugwiritsa ntchito chiganizo cha m'kalasi chomwe tatchulacho "chochitika" ndikuchijambula onse mwakamodzi.
Vuto lina lokhala ndi zizindikiro za ID ndiloti ali ndi chidziwitso chapamwamba kusiyana ndi zikhalidwe za m'kalasi. Izi zikutanthauza kuti ngati mukufuna kukhala ndi CSS yomwe ikuposa kalembedwe kake, zingakhale zovuta kutero ngati mudadalira kwambiri ma ID. Ndicho chifukwa chake otukuka ambiri a webusaiti achokapo kugwiritsa ntchito ma ID m'malo awo, ngakhale atangofuna kuti agwiritse ntchito mtengowu kamodzi, ndipo m'malo mwake atembenukira ku zida zochepa zapamwamba za mafashoni.
Malo amodzi omwe chidziwitso chimagwira ntchito ndi pamene mukufuna kukhazikitsa tsamba lomwe lili ndi zikhomo zamalonda. Mwachitsanzo, ngati muli ndi webusaiti ya parallax yomwe ili ndi zonse zomwe zili pa tsamba limodzi ndi maulumikilo omwe "amalumpha" kumbali zosiyanasiyana za tsambali. Izi zachitidwa pogwiritsa ntchito zizindikiro za ID ndi mauthenga a mauthenga omwe amagwiritsa ntchito zizindikiro izi.
Mukanangowonjezerapo mtengo wa chikhumbo chimenecho, kutsogolo ndi # chizindikiro, ku chiyamiko cha chiyanjano, monga chonchi:
Ichi ndicho chigwirizano
Mukasindikizidwa kapena kugwiritsidwa, chiyanjano ichi chidzadumpha kumbali ya tsamba lomwe liri ndi chidziwitso ichi. Ngati palibe chinthu chomwe chili pa tsambachi chikugwiritsira ntchito chidziwitso ichi, kulumikizana sikungathe kuchita chirichonse.
Kumbukirani, ngati mukufuna kupanga tsamba lomwe likugwirizanitsa pa tsamba, kugwiritsa ntchito zizindikiritso za ID kudzafunidwa, koma mukhoza kutembenukira ku masukulu onse a CSS. Ndi momwe ndikulembera masamba lero - Ndinagwiritsa ntchito osankhidwa a m'kalasi momwe ndingathere ndikungotembenukira ku ma ID pamene ndikufunikira chikhumbo choti ndichite monga ndowe ya CSS koma komanso ngati tsamba la tsamba.
Nkhani yoyamba ndi Jennifer Krynin. Yosinthidwa ndi Jeremy Girard pa 8/9/17