Emmet设置属性，编号
2018-07-31 本文已影响1人
索隆萨克
注释部分为emmet格式代码，按下tab键之后自动生成html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>emmet 属性设置</title>
</head>
<body>
<!-- ul>li.items$*5 -->
<!-- $表示占位符 -->
<ul>
<li class="items1"></li>
<li class="items2"></li>
<li class="items3"></li>
<li class="items4"></li>
<li class="items5"></li>
</ul>
<!-- h$[title=item$]{header $}*3 -->
<h1 title="item1">header 1</h1>
<h2 title="item2">header 2</h2>
<h3 title="item3">header 3</h3>
<!-- 多个操作符,使用0来填充数字 -->
<!-- ul>li.item$$$*4 -->
<ul>
<li class="item001"></li>
<li class="item002"></li>
<li class="item003"></li>
<li class="item004"></li>
</ul>
<!-- 数字倒序，使用@-* -->
<!-- ul>li.item$@-*5 -->
<ul>
<li class="item5"></li>
<li class="item4"></li>
<li class="item3"></li>
<li class="item2"></li>
<li class="item1"></li>
</ul>
<!-- 数字起始位置 -->
<!-- ul>li.item$@3*5 -->
<ul>
<li class="item3"></li>
<li class="item4"></li>
<li class="item5"></li>
<li class="item6"></li>
<li class="item7"></li>
</ul>
<!-- 属性可以不用写双引号 -->
<!-- a[href=# title=hello class=hello]{hello} -->
<a href="#" title="hello" class="hello">hello</a>
</body>
</html>
