Alamin kung ano ang ibig sabihin ng Cascade sa Cascading Style Sheets

CSS Short Course

Ang kaskad ay ang dahilan kung bakit kapaki-pakinabang ang mga estilo ng CSS sheet . Sa maikli, ang cascade ay tumutukoy sa pagkakasunud-sunod ng pagkakasunud-sunod kung paano dapat ilapat ang mga salungat na estilo. Sa madaling salita, kung mayroon kang dalawang estilo:

p {color: red; }
p {color: blue; }

Tinutukoy ng cascade kung aling kulay ang mga talata, kahit na ang estilo ng sheet ay nagsasaad na dapat silang parehong pula at asul. Sa huli, isang kulay lamang ang maaaring ilapat sa mga talata, kaya kailangang may isang order.

At ang kautusang ito ay inilalapat kung saan ang mga tagapili (ang p sa halimbawa sa itaas) ay may pinakamataas na panuntunan at kung aling order ang lumitaw sa dokumento.

Ang sumusunod na listahan ay isang pagpapadali ng kung paano nagpapasiya ang iyong browser ng isang pangunahin para sa isang estilo:

1. Hanapin sa style sheet para sa isang selector na tumutugma sa elemento. Kung walang tinukoy na mga estilo, pagkatapos ay gamitin ang mga default na panuntunan sa browser
2. Hanapin sa estilo ng sheet para sa mga tagapili na minarkahan! Mahalaga at mag-aplay sa mga naaangkop na elemento.
3. Ang lahat ng mga estilo sa style sheet ay sasapi sa default na mga estilo ng browser (maliban sa kaso ng mga style sheet ng user).
4. Ang mas tiyak na selector ng estilo, mas mataas ang precedence nito. Halimbawa, ang div> p.class ay mas tiyak kaysa sa p.class na mas tiyak kaysa sa p.
5. Sa wakas, kung ang dalawang panuntunan ay nalalapat sa parehong sangkap at may parehong selector na pangunahin, ang huling na-load ay ilalapat. Sa ibang salita, ang estilo ng sheet ay basahin mula sa itaas hanggang sa ibaba, at ang mga estilo ay inilalapat sa ibabaw ng isa't isa.

Batay sa mga panuntunang iyon, sa halimbawa sa itaas, ang mga talata ay nakasulat sa asul, dahil p {color: blue; } ay huling sa style sheet.

Ito ay isang napaka-pinasimple paliwanag ng kaskad. Kung interesado kang matuto nang higit pa tungkol sa kung paano gumagana ang kaskad, dapat mong basahin Ano ang ibig sabihin ng "Cascade" sa Cascading Style Sheets? .