Kadri miradi inavyokua, CSS rahisi inatokwa na upeo wa kimataifa — kila kichagua kinafanya kambi kimataifa, vita vya mahususi vinabriskit, na hakuna anayetaka kufuta kanuni. Meth inayoletea muundo na kanuni za kujamia ili CSS ibaki isiyo na matatizo.
Kanuni ya kujamia inayofanya mahusiano kuwa wazi na kuweka mahususi kwa kiwango (tu aina moja tu):
{ }
{ }
{ }
{ }
<div class="card card--featured">
<h2 class="card__title">...</h2>
</div>
Thamani ya BEM: majina ya aina ni yenye kujidokumenti, kuzuia kwa kanuni, na kwa ulinganifu mahususi madogo (bila kuweka ndani/vita vya id).
Ika sensa kutoka aina ndogo zenye kusudi moja moja moja katika alama:
<div class="flex items-center gap-4 p-6 rounded-lg shadow">...</div>
Faida: hakuna kujamia, hakuna CSS isiyotumiwa (inayofutwa), tokens ya muundo inayobadilika. Vibaya: HTML yenye maneno mengi. Sana maadhimisha kwa kasi yake na ulinganifu.
Jamii isiyo na kawaida katika mitandao ya sehemu — upeo wa sensa kwa sehemu ili haiwezi kumomonyeka:
import styles from "./Card.module.css"; // class names are hashed/localized
<div className={styles.card}>...</div> // → .Card_card__a1b2 (unique)
Hii inasuluhisha tatizo la upeo wa kimataifa kwa mitindo badala ya kwa kanuni.
OOCSS — separate structure from skin, reuse objects
SMACSS — categorize rules (base, layout, module, state, theme)
ITCSS — layer CSS by specificity (generic → explicit), low to high
Zote zote zinalipwa dhidi ya adui wanaofanana: kupanda kwa mahususi, migongano ya majina, nambari iliyokufa, na cascades zisizotarajiwa. Iwe kupitia kujamia (BEM), utilities (Tailwind), au upeo (Modules), zinaweka CSS inayotarajiwa na salama kubadilisha kwa kipimo.
Codebases kubwa za CSS huanguka chini ya upeo wa kimataifa na vita vya mahususi bila nidhamu.
Kuchagua na kutumia kwa imaara njia (kawaida BEM, Tailwind, au CSS Modules zenye upeo leo) ni kile kinachohifadhi sensa kuwa modulara, inayoweza kufuta, na bila migogoro kadri timu na codebase zinavyokua.