๐ฉ๐ผโ๐ป Emmet
HTML, CSS ๋ฑ์ ๋ฌธ์๋ฅผ ํธ์งํ ๋ ๋น ๋ฅธ ์ฝ๋ฉ์ ์ํด ์ฌ์ฉํ๋ ํ๋ฌ๊ทธ์ธ
์ฝ๋ ์
๋ ฅ ํ tabํค ๋๋ฅด๋ฉด ๋!
HTML ๊ธฐ๋ณธ ์ฝ๋
html:5or!+tab
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>Parent - Child
>+tab
ul>li + tab
<ul>
<li></li>
<ul>Sibling
++tab
h2+ol + tab
<h2></h2>
<ol>
</ol>
Climb-up
^or^^+tab
div>ul>li^p + tab
<div>
<ul>
<li></li>
</ul>
<p></p>
</div>div>ul>li^^p + tab
<div>
<ul>
<li></li>
</ul>
</div>
<p></p>
Grouping
()+tab
div>(header>ul>li*2>a)+footer>p + tab
<div>
<header>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</header>
<footer>
<p></p>
</footer>
</div>
Multiplication
*+tab
ul>li*3 + tab
<ul>
<li></li>
<li></li>
<li></li>
</ul>Text
{}+tab
a{link} + tab
<a href="">link</a>Item numbering
$+tab
ul>li*3{list$} + tab
<ul>
<li>list1</li>
<li>list2</li>
<li>list3</li>
</ul>ID
#+tab
#abc + tab
<div id="abc"></div>
Class
.+tab
.abc + tab
<div class="abc"></div>p.class1.class2.class3 + tab
<p class="class1 class2 class3"></p>