BEM Methodology
[SASS](https://texonom.com/sass-89533b289b8d4804a495976deac07886) 


### Blcok, Element, Modifier
각각 `__`와 `--`로 구분

### [SASS](https://texonom.com/sass-89533b289b8d4804a495976deac07886) 쓸려면 의미있고 아니면 딱히..

```type.header__navigation--navi-text {  color: red;}```
- 위 코드에서 `header`는 `Block`, `naviagtion`은 `Element`, `navi-text`는 `Modifier`



[BEM Block](https://texonom.com/bem-block-61b0e8f1900e4544bd40623fc441176f)


[BEM Element](https://texonom.com/bem-element-d58c242626d349219cb3b6b83bc539ae)


[BEM Modifier](https://texonom.com/bem-modifier-713a3ea01a97469dba20d1f4711c0a8b)



- SASS의 부모참조자(&)와 찰떡궁합
- 클래스네임만으로 마크업 구조를 알 수 있다
- 작성된 SASS에서 요소를 쉽게 찾을 수 있다
- SASS 작성 시, 늘어지는 셀렉팅을 막아줌
- 클래스네임이 너무 길어짐



> [[CSS 방법론] BEM 방식](https://nykim.work/15)





