BEM是一种用于编写CSS类名的命名约定，促进了干净和可维护的代码。它由块、元素和修饰符组成。BEM有助于避免混乱的CSS，提倡一致性和可重用性，并防止冲突。通过提供两个示例来演示BEM的工作原理。优点包括组织和一致的代码，避免CSS冲突，可重用性和易于维护。缺点包括类名过长和学习曲线。BEM对于大型项目中的干净和可扩展的代码非常重要。它改善了协作，并使CSS更易于维护。尽管存在挑战，但BEM带来了显著的好处。

BEM（Block, Element, Modifier）是一种用于HTML/CSS类命名的约定，有助于组织代码。块是独立的HTML元素，元素附属于块，修饰符表示块或元素的状态和外观。文章提供了示例，并建议使用SCSS以获得更清晰的层次结构。还推荐使用像Tailwind CSS和UnoCSS这样的原子CSS框架。

我們平時最開始學習寫 CSS 代碼的時候，我們都是這麼寫的： .main-part .tabs { /*...*/ } 其實這樣的寫法是不好的，因為它過度的與頁面中的某一部分耦合了。我們在軟件工程的

最近常常在專案裡面看到令人很頭痛的 CSS，沒有設計模式，有大量不明白的階層跟命名，完全無法複用的元素XDD，心中是滿滿的 fuck。 於是我就開