HTML VSCode Emmet 정리
VSCode 내에 기본 작착 되어있다.
1. 기본 html 폼 생성 / !
<!DOCTYPE html>
<html>
<head></head>
<body></body>
</html>2. 기본태그 생성 / div
<div>3. class 있는 div 생성 / .myClass
<div class="myClass">4. id 있는 div 생성 / #myId
<div id="myId">5. 자식 노드 생성 / div>ul>li
<div>
<ul>
<li></li>
</ul>
<div>6. 형제 노드 만들기 / div>ul+ol
<div>
<ul></ul>
<ol></ol>
</div>7. 노드 반복 만들기 / ul>li*5
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>8. 자식노드 생성중 상위 노드 추가 / div>ul>li^ol
<div>
<ul>
<li></li>
</ul>
<ol></ol>
</div>9. 그룹화 / div>(header>ul>li*2>a)+footer>p
<div>
<header>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ui>
</header>
<footer>
<p></p>
</footer>
</div>10. 태그 내용넣기 / p{Hello}
<p>hello</p>11. 자동 숫자 넣기 / p.myClass${item $}
<p class="myClass1">item 1</p>
<p class="myClass2">item 2</p>
<p class="myClass3">item 3</p>
<p class="myClass4">item 4</p>
<p class="myClass5">item 5</p>12. 택스트 더미 생성 / p>lorem / p>lorem4
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ratione expedita ullam ipsa natus possimus quasi, ex ut error atque iusto reiciendis, cum maiores corrupti architecto cumque doloribus odio, molestiae nesciunt.</p>
<p>Lorem ipsum dolor sit.</p>
공부 기록