Kana uchidzidza misimboti yeCSS yakakosha, munhu anodzidziswa kunyora modular, reusable, uye anotsanangura masitayipi kuti ave nechokwadi chekuchengetedza. Asi kana vagadziri vanobatanidzwa nechaiyo-nyika maapplication, kazhinji zvinonzwa zvisingagoneke kuwedzera maUI maficha pasina masitaera anonyudza munzvimbo dzisingatarisirwe. Nyaya iyi inowanzoita snowballs kuita self-fulfilling loop; masitayera anotemerwa kudivi rimwe chete kana kirasi anotanga kuoneka paasiri ake. Izvi zvinomanikidza mugadzirisi kuti agadzire zvakatonyanya kusarudzwa kuti zvipfuure zvitaera zvakaburitswa, izvo zvinobva zvaita netsaona zvitaera zvepasirese, zvichingodaro. Rigid kirasi zita magungano, akadai seBEM, imwe yedzidziso mhinduro kunyaya iyi. Iyo BEM (Block, Element, Modifier) methodology inzira yakarongeka yekutumidza makirasi eCSS kuti ive nechokwadi chekushandiswa zvakare uye chimiro mukati meCSS mafaera. Kutumidza magungano seizvi kunogona kuderedza cognitive mutoro nekusimudzira dura remutauro kutsanangura zvinhu uye mamiriro azvo, uye kana ikashandiswa nemazvo, inogona kuita masitayipi ezvishandiso zvakakura kuve nyore kuchengetedza. Munyika chaiyo, zvisinei, hazviwanzoita saizvozvo. Zvinonyanya kukosha zvinogona kuchinja, uye nekuchinja, kuita kunenge kusingawirirani. Shanduko diki kune chimiro cheHTML chinogona kuda akawanda CSS kirasi zita revisions. Nezvikumbiro zvinonyanya kupindirana kumberi, mazita ekirasi anotevera BEM pateni anogona kureba uye asingaite (semuenzaniso, app-user-overview__status--is-authenticating), uye kusatevedzera zvizere kumitemo yekupa mazita kunotyora magadzirirwo ehurongwa, nekudaro achiramba mabhenefiti ayo. Tichifunga nezvematambudziko aya, hazvishamisi kuti vanogadzira vakatendeukira kune masisitimu, Tailwind iri iyo inonyanya kufarirwa CSS chimiro. Pane kuedza kurwisa zvinoita sehondo isingakundiki pakati pezvitaera, zviri nyore kusiya paCSS Cascade uye kushandisa maturusi anovimbisa kuzviparadzanisa nevamwe. Vagadziri Vanotsamira Zvakawanda PaZvishandiso Tinoziva sei kuti vamwe vanogadzira vanoda chaizvo kudzivirira masitaera akadhindwa? Iko kusimuka kwe "yemazuva ano" yekumberi-yekupedzisira tooling - seCSS-mu-JS masisitimu - akagadzirirwa chinangwa ichocho. Kushanda nematayera akasarudzika akanyatso kukwenenzverwa kune chaiwo zvikamu zvinogona kuita sekufema kwemweya mutsva. Inobvisa kukosha kwekutumidza zvinhu - zvichiri rimwe remabasa anovengwa uye anopedza nguva - uye inobvumira vanogadzira kuti vabudirire pasina kunyatsonzwisisa kana kusimudzira mabhenefiti enhaka yeCSS. Asi kusiya CSS Cascade kunouya nematambudziko ayo. Semuyenzaniso, kugadzira masitaera muJavaScript kunoda magadzirirwo anorema ekuvaka uye anowanzo tungamira kune masitaera kusanganisa nechikamu markup kana HTML. Panzvimbo yekunyatsofunga nezvemakongiresi ekupa mazita, tinobvumira maturusi ekuvaka kuti atigadzirisire anosarudza uye zviziviso zvedu (semuenzaniso, .jsx-3130221066), zvinoda vanogadzira kuti vafambirane nemumwe zvekare mutauro wemanyepo mukati newawo. (Sekunge iyo yekuziva mutoro wekunzwisisa izvo zvese zvinoshandiswa nechikamu chako maEffects kuita zvaive zvisati zvakwana!) Kuenderera mberi nekubvisa basa rekutumidza makirasi kukushandisa kunoreva kuti kugadzirisa kwekutanga kunowanzo kumanikidzirwa kune chaiwo mashandisirwo eshanduro akaunganidzwa kuti agadziriswe, pane kusimudzira maficha ebhurawuza anotsigira kugadzirisa kwehupenyu, senge Developer Tools. Zvakaita sekuti isu tinoda kugadzira maturusi ekugadzirisa maturusi atiri kushandisa kuburitsa izvo webhu zvinopa - zvese nekuda kwekutiza "marwadzo" ekunyora yakajairwa CSS. Sezvineiwo, maficha emazuva ano eCSS haangoite kuti kunyora kwakajairwa CSS kuve nyore nyore asi zvakare kunopa vanogadzira vakaita sesu simba rakawanda rekutarisira cascade uye kuti ishande kwatiri. CSS Cascade Layers muenzaniso wakanaka, asi pane chimwe chimiro chinowana kushaikwa kwekutarisira kunoshamisa - kunyangwe izvo zviri kuchinja iye zvino sezvo zvangove Baseline inoenderana. Iyo CSS @scope At-Rule Ini ndinoona iyo CSS @scope pa-mutemo semushonga ungangoita werudzi rwechimiro-chinokonzeresa-chinokonzeresa kushushikana kwatakafukidza, icho chisingatimanikidzire kukanganisa mabhenefiti ekuzvarwa ezvekubvisa uye mamwe maturusi ekuvaka. "The @scope CSS at-rule inoita kuti iwe usarudze zvinhu mune chaiyo DOM subtrees, kunanga zvinhu chaizvo pasina kunyora zvakanyanya-chaiwo zvakasarudzwa izvo zvakaoma kupfuudza, uye pasina kubatanidza vasarudzo vako zvakanyanya kune iyo DOM chimiro." - MDN.
Mune mamwe mazwi, isu tinokwanisa kushanda nemataera ari ega mune chaiwo mamiriro pasina kupira nhaka, kudonha, kana kunyange kupatsanurwa kwekutanga kwekunetsekana.iyo yave iri nhungamiro yenguva refu yekusimudzira kwepamberi. Uyezve, ine yakanakisa browser yekuvhara. Muchokwadi, Firefox 146 yakawedzera rutsigiro rwe @scope muna Zvita, ichiita kuti Baseline ienderane kekutanga. Heino kuenzanisa kuri nyore pakati pebhatani uchishandisa iyo BEM pateni maringe nemutemo we @scope: