导航栏bem命名核心是明确块与元素归属：nav为独立块，dropdown须为独立块而非nav__dropdown；状态类仅修饰具体元素，禁止跨层或描述性命名，scss中禁用三层嵌套。
导航栏用 BEM 命名，核心是分清「块」和「元素」的归属关系——nav 是块，dropdown 是独立块，不是 nav__dropdown。
nav 是块，所有直接子结构用 nav__ 前缀
只要这个元素是导航栏的组成部分、且无法脱离导航栏独立存在，就该归入 nav 块。比如菜单列表、链接、Logo 容器、切换按钮（移动端汉堡）。
-
nav__list：包裹所有导航项的<ul></ul>或<nav></nav>内部容器 -
nav__link：每个可点击的导航链接 -
nav__logo：仅用于当前导航上下文的 Logo 区域 -
nav__toggle：移动端展开/收起按钮（不叫nav__hamburger，避免描述性命名）
注意：nav__item 是常见错误——它没语义价值，且容易和 nav__link 职责重叠；直接用 nav__link 更准确，除非你真需要一个无交互的容器包裹链接（如加动画 wrapper），那才另设 nav__item。
下拉菜单必须单独声明为 dropdown 块
下拉菜单有独立交互逻辑（hover/click、键盘导航、焦点管理）、可复用场景（表单内、工具栏里也能用），它不是 nav 的一部分，而是协作关系。
- 正确：
dropdown、dropdown__toggle、dropdown__menu、dropdown__item - 错误：
nav__dropdown、nav__dropdown-menu—— 这会让 dropdown 无法被其他模块复用，也破坏了 Block 的独立性 - HTML 中通过 class 并列声明：
<div class="nav__link dropdown__toggle">产品</div> <div class="dropdown__menu">...</div>
这样做还能避免 CSS 权重污染：nav__link 样式不会意外影响 dropdown__toggle，反之亦然。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
状态类只修饰具体元素，不跨层
激活态、禁用态、加载中这些，必须绑定到它真正所属的 Block 或 Element 上，不能“借壳”。
- 正确：
nav__link--active、dropdown__item--disabled - 错误：
nav--active（整个导航栏不会“激活”，这是语义错位）或dropdown__toggle--active（toggle 本身没有 active 状态，是 menu 或 link 在 active） - 不要用
nav__link--current这类描述性修饰符；统一用--active，靠 JS 控制 class 切换即可，语义更稳定
修饰符名要可枚举、可预测：--active、--disabled、--expanded，而不是 --red、--big。
SCSS 中禁止嵌套出 nav__link__icon 这种三级结构
BEM 只允许一层 Element，__ 后面不能再跟 __。图标如果是 nav__link 的视觉附属，就用 nav__link-icon；如果它在多个组件中通用（如用户头像、操作图标），就该抽成独立 Block icon。
- 正确 SCSS：
.nav { &__link { display: flex; align-items: center; } &__link-icon { margin-right: 8px; } } - 错误写法：
.nav { &__link { &__icon { ... } // 编译后是 .nav__link__icon，违反 BEM - 更危险的是：
nav__link .icon这种后代选择器——它放弃 BEM 的作用域隔离，一旦全局.icon改了，这里就不可控
真正容易被忽略的点是：BEM 不是字符串拼接游戏，而是组件契约。每个 __ 都意味着“这个东西离开父块就没意义”。判断不了的时候，先问一句：它能不能被剪出来，贴到另一个页面里还正常工作？不能，就是 Element；能，大概率该是 Block。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
