본문 바로가기
Web

BEM

by ma_ro 2020. 3. 2.

코드의 재사용성을 높이기 위한 Component 기반의 웹 개발 접근법 중 하나이다.
BEM은 각각 Block, Element, Modifier의 약자이다.

 

기능적으로 독립된 Component로서 HTML에서는 class 속성으로 표현 되는 것이 Block이며,

그 Block의 구성 요소가 Element이다.

Modifier는 Block과 Element의 외향을 결정하는 entity이다.

 

이름을 지을 때 상태가 아닌 그 목적으로 기술되어야 하며,
각각은 double underscore와 single underscore ( Block이름__Element이름_Modifier이름 )으로 분리한다.

 

하기 링크는 BEM Quick start 번역문서.

 

 

BEM( Block, Element, Modifier) Quick start

들어가며 👀 이 글은 BEM Quick Start 를 읽고 공부한 내용을 복습하기 위해 번역을 했으며, 내용이 요약된 게 있을 수 있습니다. 🐶 BEM 소개 BEM이란 Block, Element, Modifier의 첫 글자만 가져와 이름 지은 Component 기반의 웹 개발 접근법 중 하나 입니다. 이 방법론은 유저 인터페이스를 독립된 여러...

velog.io

 

'Web' 카테고리의 다른 글

API 요청 통제 기술  (0) 2023.08.24
CSS - transition, ease  (0) 2020.01.29
Front-end Framework 사이트  (0) 2020.01.23
HTML, CSS, JavaScript  (0) 2020.01.23

댓글