<TIL id="20210923목">clearfix, Emmet, BEM</TIL>

1. 가상요소 선택자(::) & clearfix

• html에 가상의 요소를 만들어서 거기에 css속성을 추가하는 것

• 필수적으로 content라는 속성이 필요함

• clearfix라는 float을 해제하는 전역화된 css 선택자를 만들어 두고, 필요에 따라 클래스로 부여해서 사용하기

.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

• clearfix 클래스가 부여된 컨테이너에는 float을 사용하는 요소들만 들어있어야함

2. Emmet문법??

Emmet wiki

.item{$}*3

<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>

3. BEM(Block Element Modifier)

BEM website

Block Element Modifier is a methodology that helps you to create reusable components and code sharing in front-end development

CSS구조 및 상태를 관리하기 위한 CSS개발 방법론