BEM禁止标签选择器因其隐式依赖HTML语义，导致样式无法归属组件、易冲突失效；应改用.btn--submit等明确归属的类名确保可迁移与协作安全。
标签选择器（如 h1、ul、button）在BEM语境下不是“写法错误”，而是主动放弃控制权——它让样式和HTML语义强绑定，一旦结构微调或语义变更，样式就失效。
为什么 ul 比 nav__list 更难维护
标签选择器隐式依赖 DOM 类型，而 BEM 要求样式归属明确、可迁移。比如：
-
ul无法区分导航菜单、评论列表、侧边栏链接——三者语义不同，但标签相同，样式必然冲突或覆盖 - 若某天把
<ul></ul>换成<div role="list">（无障碍升级），所有基于 <code>ul的样式立即失效 - BEM 组件常被 SSR 或微前端动态注入，
ul无命名空间，极易被全局重置样式（如 normalize.css）意外干预 - 第三方组件库（如 Ant Design、Element Plus）内部也用
button，你写的button:hover可能覆盖其默认行为，也可能被它覆盖 - 需要为「表单提交按钮」和「弹窗关闭按钮」设置不同圆角/阴影时，
button--close可直接复用，而button.close违反 BEM 原则且特异性失控 - 自动化测试（Cypress / Playwright）靠类名定位元素，
button匹配整个页面所有<button></button>，定位不稳；btn--submit则精准唯一 -
article h2：看似结构清晰，实则把标题样式绑死在<article></article>内，挪到卡片或弹窗里就失效 -
form input[type="text"]：输入框类型随框架变化（React 可能用<input>，Vue 可能封装为自定义组件），且无法表达“搜索输入框”还是“用户名输入框” -
svg path：图标路径样式应归属icon--search，而非依赖 SVG 结构，否则换用 iconfont 或<img alt="为什么BEM不建议使用标签选择器_保持CSS类名独立性以提高复用性" >就崩
button 和 btn 在复用场景下的实际差异
真实项目中，button 选择器会立刻暴露三个硬伤：
哪些情况看似合理，实则已踩坑
开发者常以“语义化”为由保留标签选择器，但多数是混淆了 HTML 语义与 CSS 归属：
立即学习“前端免费学习笔记（深入）”；
BEM 不禁止你写 button，但它要求你意识到：只要用了，这个样式就不再属于某个组件，而属于整个 HTML 规范——而这正是大型项目样式失控的起点。
