bem-methodology
Installation
SKILL.md
BEM — Block Element Modifier: Complete Reference Guide
Official spec: https://getbem.com
MindBEMding (founding article): https://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax
BEM at Yandex (origin): https://en.bem.info/methodology
1. What is BEM?
BEM is a CSS naming methodology created by Yandex (~2007) that structures selectors into three entities:
| Entity | Role | Example |
|---|---|---|
| Block | Independent, reusable UI component | .card |
| Element | Part of a block with no standalone meaning | .card__title |
| Modifier | A state or appearance variation of a block or element | .card--featured, .card__title--large |
Standard syntax: