首页 > itarticle > emmet-study

emmet-study

admin 11月 11, 2020 0

快速编写代码

  • 初始化

! or html:5

1
2
3
4
5
6
7
8
9
10
11
12
 
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
</body>
</html>
  • 一键ID、class

div.class#id

1
 
<div class="bar" id="foo"></div>
  • 嵌套

nav>ul>li

1
2
3
4
5
 
<nav>
    <ul>
        <li></li>
    </ul>
</nav>

div+p+bq

1
2
3
 
<div></div>
<p></p>
<blockquote></blockquote>

div+div>p>span+em^bq

1
2
3
4
5
 
<div></div>
<div>
    <p><span></span><em></em></p>
</div>
<blockquote></blockquote>
  • 分组

(.foo>h1)+(.bar>h2)

1
2
3
4
5
6
 
<div class="foo">  
  <h1></h1>  
</div>  
<div class="bar">  
  <h2></h2>  
</div>
  • 定义多个元素

ul>li*3

1
2
3
4
5
 
<ul>  
  <li></li>  
  <li></li>  
  <li></li>  
</ul>
  • 定义多个带属性的元素

ul>li.item$*5

1
2
3
4
5
6
7
 
<ul>
    <li class="item1"></li>
    <li class="item2"></li>
    <li class="item3"></li>
    <li class="item4"></li>
    <li class="item5"></li>
</ul>
微海报分享

近期文章

近期评论

标签

热门

文章归档

分类目录

功能