What is BEM (Block Element Modifier) methodology?

BEM is a naming convention for writing scalable and reusable CSS.

Structure:

.block__element--modifier

Example:

<div class="card card--featured">

<h2 class="card__title">Profile</h2>

</div>

Key Takeaway:

BEM enforces clarity:

• Block = independent component
• Element = part of a block
• Modifier = variation/state