Skip to content

Instantly share code, notes, and snippets.

@gokulkrishh
Last active October 28, 2020 12:54
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 3 You must be signed in to fork a gist
  • Save gokulkrishh/2d9df056f104497a1eb3ce4920aa8cc6 to your computer and use it in GitHub Desktop.
Save gokulkrishh/2d9df056f104497a1eb3ce4920aa8cc6 to your computer and use it in GitHub Desktop.
BEM Approach - http://getbem.com/naming/

BEM - Block, Element, Modifier

1. Block
----------------------------------------------

Eg: menu

<ul class="menu"></ul>

2. Elements
----------------------------------------------

Eg: menu__list

<ul class="menu">
  <li class="menu__list"></li>
</ul>

3. Modifiers
----------------------------------------------

Eg: menu__list--active

<ul class="menu">
  <li class="menu__list"></li>
  <li class="menu__list menu__list--active"></li>
</ul>
@hyfydistro
Copy link

Nice guide!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment