BEM的用法是什么？BEM命名规则要关注哪些？
发布时间：2022-04-20 09:45:36 所属栏目：语言 来源：互联网
导读：这篇文章给大家分享的是有关BEM的内容。一些朋友可能对BEM是什么，BEM的用法等等不是很了解，因此本文就给大家详细介绍一下BEM，感兴趣的朋友就继续往下看吧。 什么是BEM BEM（块，元素，修饰符）是基于组件的Web开发的一种前端命名方法论，主要针对CSS。其
|
这篇文章给大家分享的是有关BEM的内容。一些朋友可能对BEM是什么，BEM的用法等等不是很了解，因此本文就给大家详细介绍一下BEM，感兴趣的朋友就继续往下看吧。 什么是BEM BEM（块，元素，修饰符）是基于组件的Web开发的一种前端命名方法论，主要针对CSS。其背后的想法是将用户界面分为独立的块。即使使用复杂的UI，这也使界面开发变得容易和快速，并且允许重用现有代码而无需复制和粘贴。 优势 避免样式冲突 减小名称长度 提高可阅读性 增加样式重用 怎么使用BEM Block 一个功能独立的页面组件，可以重复使用 块不应影响其环境，这意味着您不应设置块的外部几何形状（边距）或位置 < div class = "red-text" > Element 块的复合部分，不能单独使用 元素全名的结构为block-name__element-name Search 一个元素始终是块的一部分，而不是另一个元素，因此元素名称不可定义为 block__elem1__elem2 的层次结构 元素始终是一个块的一部分，您不应该与该块分开使用 修饰符全名的结构遵循以下模式： block-name_modifier-name_modifier-value block-name_modifier-name--modifier-value block-name__element-name_modifier-name_modifier-value block-name__element-name_modifier-name--modifier-value Search 不能将修饰符与修饰的块或元素隔离使用。修饰符应更改实体的外观，行为或状态，而不是替换它 SearchSearch 在修饰符和元素名称中添加块名称的好处 有助于减少一个块的元素和修饰符对另一个块的实现的影响 可更清楚的知道修饰符应用于该DOM节点上的哪个实体 唯一名称使查找代码或文件系统中的实体变得更加容易 什么时候应该用 BEM 格式 使用 BEM 的诀窍是，你要知道什么时候哪些东西是应该写成 BEM 格式的。 并不是每个地方都应该使用 BEM 命名方式。当需要明确关联性的模块关系时，应当使用 BEM 格式。 （编辑：济南站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
