Isitayela sokubonwa kwewebhusayithi kunye nesakhiwo sichazwe yiScss okanye i-Cascading Style Sheets. Lawa maxwebhu abumba ukukhangela kwekhasi lewebhu lewebhu lewebhu, ukubonelela iziphequluli zewebhu ngemiyalelo malunga nendlela yokubonisa amaphepha avela kuloo marki. I-CSS ilawula ukuma kwekhasi, kunye nombala, imifanekiso yangemvelaphi, i- typography kunye nokunye okuninzi.
Ukuba ukhangele iFayile yeCSS, uza kubona ukuba nayiphi na i-markup okanye ulwimi lokubhala, ezi fayili zinesivumelwano esithile kubo. Ishidi ngalinye lenziwe ngamanani e-CSS. Le mithetho, xa ithatyathwe ngokugcwele, yiyiphi iifayile kwisayithi.
Iingxenye zolawulo lweCSS
Ulawulo lweCSS lwenziwe ngamalungu amabini ahlukeneyo - umkhethi kunye nesibhengezo. Umkhethi ukhetha oko kuthethwa kwiphepha kunye nesibhengezo ukuba kufuneka ukuba kubhalwe njani. Umzekelo:
{
umbala: # 000;
}
Lo mlawuli weCSS. Inxenye yomkhethi yi "p", into ekhethiweyo ye "imihlathi". Ngoko ke, kuya kukhetha zonke iziqendu kwisayithi kwaye ubonelele ngale ndlela (ngaphandle kokuba kukho imihlathi ejoliswe ngamathenda athile kwenye indawo kwixwebhu lakho le-CSS).
Inxalenye yomgaqo othi "umbala: # 000;" yinto eyaziwa njengezibhengezo. Esi simemezelo senziwe ngamacandelo amabini-ipropati kunye nexabiso.
Ipropati "yimibala" yolu qhosha. Icacisa ukuba yeyiphi impawu yomkhethi oza kutshintshwa ngokubonakalayo.
Ixabiso lento ekhethiweyo yeCSS iya kutshintshwa ibe. Ngokomzekelo wethu, sisebenzisa ixabiso le-hex ye-# 000, eyi-CSS efutshane "emnyama".
Ngoko usebenzisa ulawulo lweCSS, lethu iphepha liza kuba nemihlathi iboniswe kumbala wefonti omnyama.
Ezingundoqo zeMpahla yeCSS
Xa ubhala iimpawu zeCSS, awukwazi ukuzenza nje njengoko ubona kufanelekile. Kwiimeko, "umbala" yindawo ekhoyo yeCSS, ngoko ungayisebenzisa. Le propati yintoni eyenza umbala wombhalo wento. Ukuba uzame ukusebenzisa "umbala wombhalo" okanye "umbala wefonti" njengezakhiwo zeCSS, ezi ziza kuphumelela ngenxa yokuba azizona iindawo zangempela zolimi lweCSS.
Omnye umzekelo yipropati "umfanekiso wesiseko". Le propati isetya umfanekiso ongasetyenziselwa imvelaphi, njengale:
.logo {
umfanekiso wesemva: url (/images/company-logo.png);
}
Ukuba uzama ukusebenzisa "imvelaphi-mfanekiso" okanye "imvelaphi engemvelaphi" njengepropati, baya kuphumelela ngenxa yokuba, kwakhona, ezi zinto azizona izakhiwo ze-CSS.
Ezinye iiCSS Properties
Kukho iipropati zeCSS ongazisebenzisa ukuseta isayithi. Ezinye imizekelo:
- Umda wamanzi (kuquka umgca womda, umbala womda, kunye nobubanzi bomda)
- Ukupakisha (kuquka i-padding-top, i-padding-right, i-padding-bottom, kunye ne-padding-left)
- Imimandla (kuquka umgca-phezulu, umgama ongakwesokudla, umgama osezantsi, kunye nekhohlo engasekhohlo)
- Ubume bentsapho
- Isayizi yefonti
- Umbala weMvelaphi
- Ububanzi
- Ukuphakama
Ezi zixhobo ze-CSS zikhulu ukuzisebenzisa njengemizekelo, kuba zonke zichanekile kwaye, nokuba ungazi iCSS, unokucinga ukuba zenza ntoni ngokusekelwe kumagama abo.
Kukho ezinye iimpahla zeCSS eziza kuhlangana nazo kwaye ezingenakucaca ukuba zisebenza njani ngokusekelwe ngamagama abo:
- Float
- Sula
- Ukuphuphuma
- Ukuguqulwa kombhalo
- Inkcazo ye Z
Njengoko uqala ukungena kwi-web design, uya kuhlangana (kwaye usebenzise) zonke ezi ndawo kunye nezinye!
Iipropati zifuna iimilinganiselo
Njalo xa usebenzisa indlu, kufuneka unike ixabiso-kwaye ezinye iipropati ziyakwamkela kuphela amanani athile.
Kwimizekelo yethu yokuqala yomhlaba "umbala", kufuneka sisebenzise ixabiso lombala. Le nto ingaba yinani le-hex, ixabiso le- RGBA, okanye nemifanekiso yamagama . Naluphi na loo milinganiselo iya kusebenza, nangona kunjalo, ukuba usebenzisa igama elithi "inzima" ngale propati, ayiyi kwenza nto kuba, njengoko ichaza njengaleli gama, lingabi lixabiso elibonakalayo kwiCSS.
Umzekelo wethu wesibini we "mvelaphi-mfanekiso" ufuna ukuba umfanekiso wendlela usebenzise umfanekiso owenziwe kwiifayile zewebhusayithi yakho. Le yixabiso / i-syntax efunekayo.
Zonke iipropati zeCSS zixabisa ukuba zilindele. Umzekelo:
- Umbala weBorder ulindele ixabiso lombala
- Ubungakanani bemida bemi lindela ixabiso lexabiso, njengamaphikseli okanye ipesenti
- Izitayela zeeMida zilindele enye yezindlela ezigcinwe ngazo ezi ndawo ezisetyenzisiweyo, njengesiqili "
Ukuba uhamba uluhlu lweempahla zeCSS, uya kubona ukuba ngamnye wabo unemilinganiselo ekhethekileyo aya kuyisebenzisa ukudala izitayela ezijoliswe kuzo.
Ehlelwe nguJeremy Girard