Wakati wa kujifunza kanuni za msingi za CSS, mtu hufundishwa kuandika mitindo ya moduli, inayoweza kutumika tena na ya maelezo ili kuhakikisha udumishaji. Lakini wasanidi programu wanapojihusisha na programu za ulimwengu halisi, mara nyingi huhisi haiwezekani kuongeza vipengele vya UI bila mitindo inayovuja katika maeneo yasiyotarajiwa. Suala hili mara nyingi huingia kwenye kitanzi cha kujitegemea; mitindo ambayo kinadharia inalenga kwa kipengele au darasa moja huanza kuonekana mahali ambapo haifai. Hii inamlazimu msanidi programu kuunda viteuzi mahususi zaidi ili kubatilisha mitindo iliyovuja, ambayo kisha kubatilisha mitindo ya kimataifa kwa bahati mbaya, na kadhalika. Mikataba ya majina ya darasa thabiti, kama vile BEM, ni suluhisho moja la kinadharia kwa suala hili. Mbinu ya BEM (Block, Element, Modifier) ni njia iliyoratibiwa ya kutaja aina za CSS ili kuhakikisha utumiaji tena na muundo ndani ya faili za CSS. Kutaja kanuni kama hii kunaweza kupunguza mzigo wa utambuzi kwa kutumia lugha ya kikoa kuelezea vipengele na hali yao, na ikiwa itatekelezwa kwa usahihi, inaweza kufanya mitindo ya programu kubwa iwe rahisi kudumisha. Katika ulimwengu wa kweli, hata hivyo, haifanyiki hivyo kila wakati. Vipaumbele vinaweza kubadilika, na kwa mabadiliko, utekelezaji unakuwa hauendani. Mabadiliko madogo kwenye muundo wa HTML yanaweza kuhitaji masahihisho mengi ya jina la darasa la CSS. Kwa programu zinazoingiliana sana za mbele, majina ya darasa yanayofuata muundo wa BEM yanaweza kuwa marefu na yasiyoeleweka (k.m., muhtasari-wa-mtumiaji__hali-inathibitisha), na kutotii kikamilifu sheria za majina huvunja muundo wa mfumo, na hivyo kughairi manufaa yake. Kwa kuzingatia changamoto hizi, haishangazi kwamba watengenezaji wamegeukia mifumo, Tailwind ikiwa mfumo maarufu zaidi wa CSS. Badala ya kujaribu kupigana na kile kinachoonekana kama vita maalum isiyoweza kushinda kati ya mitindo, ni rahisi kuachana na CSS Cascade na kutumia zana zinazohakikisha kutengwa kabisa. Watengenezaji Wanategemea Zaidi Huduma Je, tunajuaje kwamba baadhi ya wasanidi programu wana nia ya kuepuka mitindo ya kuporomoka? Ni kuongezeka kwa zana za "kisasa" za mbele - kama mifumo ya CSS-in-JS - iliyoundwa mahsusi kwa madhumuni hayo. Kufanya kazi na mitindo iliyotengwa ambayo imeangaziwa kwa vipengele maalum inaweza kuonekana kama pumzi ya hewa safi. Huondoa hitaji la kutaja vitu - bado ni mojawapo ya kazi za mbele zinazochukiwa na zinazochukua muda mwingi - na huruhusu wasanidi programu kuwa na tija bila kuelewa kikamilifu au kutumia manufaa ya urithi wa CSS. Lakini kuacha Cascade ya CSS kunakuja na shida zake. Kwa mfano, utunzi wa mitindo katika JavaScript unahitaji usanidi mzito wa muundo na mara nyingi husababisha mitindo kuchanganyikana vibaya na alama za sehemu au HTML. Badala ya kanuni za kutaja zinazozingatiwa kwa uangalifu, tunaruhusu zana za uundaji kututengenezea viteuzi na vitambulishi kiotomatiki (k.m., .jsx-3130221066), inayohitaji wasanidi programu kufuatana na lugha nyingine bandia ndani na yenyewe. (Kama kwamba mzigo wa utambuzi wa kuelewa ni nini matumizi ya sehemu yako yoteMadhara hayakuwa ya kutosha!) Kuondoa zaidi kazi ya kutaja madarasa kuwa zana kunamaanisha kuwa utatuzi wa kimsingi mara nyingi unabanwa kwa matoleo mahususi ya programu yaliyokusanywa kwa ajili ya usanidi, badala ya kutumia vipengele vya asili vya kivinjari vinavyoauni utatuzi wa moja kwa moja, kama vile Zana za Wasanidi Programu. Ni kana kwamba tunahitaji kuunda zana za kutatua zana tunazotumia ili kupata kile ambacho wavuti tayari hutoa - yote kwa ajili ya kuepuka "maumivu" ya kuandika CSS ya kawaida. Kwa bahati nzuri, vipengele vya kisasa vya CSS sio tu vinafanya uandishi wa CSS wa kawaida kunyumbulika zaidi bali pia huwapa wasanidi programu kama sisi uwezo mkubwa zaidi wa kudhibiti mteremko na kuufanya utufanyie kazi. Tabaka za CSS Cascade ni mfano mzuri, lakini kuna kipengele kingine ambacho hupata ukosefu wa umakini wa kushangaza - ingawa hiyo inabadilika kwa kuwa hivi majuzi imeendana na Msingi. CSS @scope At-Rule Ninachukulia kanuni ya CSS @scope at-rule kuwa tiba inayoweza kuponya aina ya wasiwasi unaosababishwa na uvujaji ambao tumeshughulikia, ambayo haitulazimii kuathiri faida za asili za wavuti kwa uondoaji na zana za ziada za ujenzi. "Utawala wa @scope CSS hukuwezesha kuchagua vipengee katika vijiti maalum vya DOM, ukilenga vipengele kwa usahihi bila kuandika viteuzi mahususi ambavyo ni vigumu kubatilisha, na bila kuunganisha viteuzi vyako kwa nguvu sana kwenye muundo wa DOM." - MDN.
Kwa maneno mengine, tunaweza kufanya kazi kwa mitindo ya pekee katika matukio mahususi bila kutoa sadaka ya urithi, kuteleza, au hata mgawanyo wa kimsingi wa wasiwasi.ambayo imekuwa kanuni elekezi ya muda mrefu ya maendeleo ya mbele. Kwa kuongeza, ina chanjo bora ya kivinjari. Kwa kweli, Firefox 146 iliongeza usaidizi kwa @scope mnamo Desemba, na kuifanya Msingi iendane kwa mara ya kwanza. Hapa kuna ulinganisho rahisi kati ya kitufe kwa kutumia muundo wa BEM dhidi ya sheria ya @scope: