BEM Naming Convention

// Uses Block Element Modifier methodology for consistent CSS class naming

CSSFrontendBest PracticesNaming
Highly Rated
Community Verified

// detailed.guidelines

# BEM Naming Convention

BEM (Block Element Modifier) is a naming convention that makes CSS more maintainable.

## Structure
- **Block**: Standalone component (`.card`)
- **Element**: Part of a block (`.card__title`)
- **Modifier**: Variation of a block or element (`.card--featured`)

## Examples

```css
.card { }
.card__title { }
.card__content { }
.card--featured { }
.card__title--large { }
```

This convention prevents naming conflicts and makes your CSS more predictable and easier to maintain.