[HTML/CSS] 1-4. HTML Emmet

4. HTML Emmet

 

마크업 개발의 속도를 붙여줄 치트키

• 1. 자동완성 : tab키
• 2. 텍스트 : {}
• 3. 자식(하위)요소 : >
• 4. 형제 요소 : +
• 5. 올라가기 : ^
• 6. 반복하기 : *
• 7. 그룹화 : ()
• 8. 클래스 : .
• 9. 아이디 : #
• 10. 속성 : [attr]
• 11. 넘버링 : $

 

 

예제

• 1. div(tab키)
• 2. div{안녕}
• 3. div>div
• 4. div>p+a
• 5. div>p^div
• 6. ul>li*4
• 7. ul>(li>a)*4
• 8. div.class-name
• 9. div#id
• 10. img[alt="이미지 설명"]
• 11. div.item$*6

 

 

---