HTML :: Emmet (Zen Coding)

J·2024년 5월 25일

HTML

목록 보기
5/5
post-thumbnail

ID 선택자

  • ID가 test인 h1 태그를 만들기
h1#test

클래스 선택자

  • 클래스 값이 a b c 인 h1 태그를 만들기
h1.a.b.c

  • 클래스 값 item 뒤에 숫자를 3까지 넣어 만들기
li.item$*3

속성 선택자

  • 속성 타이틀이 test인 h1 태그를 만들기
h1[title=test]

ul>li

  • ul 아래에 li 5개 만들기
ul>li*5

  • ul 아래에 li 5개 안에 a를 넣어 만들기
ul>li*5>a

  • ul 아래에 li 5개 안에 a를 넣고 그안에 img 태그 넣어 만들기
ul>li*5>a>img

내용이 들어간 태그

  • test 내용이 들어간 p 태그 만들기
p>{test}

참고 사이트

https://docs.emmet.io/
https://ko.wikipedia.org/wiki/%EC%97%90%EB%B0%8B_(%EC%86%8C%ED%94%84%ED%8A%B8%EC%9B%A8%EC%96%B4)

profile
나야

0개의 댓글