Emmet [前端]

前端开发不得不推荐该工具，熟悉之后可以非常方便的书写HTML和CSS

官方文档API：http://docs.emmet.io/cheat-sheet/

语法

子元素 >

nav>ul>li

同级别/兄弟节点 +

div+p+bq

上一级别 ^

div+div>p>span+em^bq

div+div>p>span+em^^bq

分组 ()

div>(header>ul>li*2>a)+footer>p

(div>dl>(dt+dd)*3)+footer>p

多个 *

ul>li*5

有序 $

ul>li.item$*5

h$[title=item$]{Header $}*3

Header 1
Header 2
Header 3

ul>li.item$$$*5

ul>li.item$@-*5

ul>li.item$@3*5

id class 属性

#header

.title

form#search.wide

p.class1.class2.class3

自定义属性

p[title="Hello world"]

td[rowspan=2 colspan=3 title]

[a='value1' b="value2"]

文本内容 {}

a{Click me}

Click me

p>{Click }+a{here}+{ to continue}

Click here to continue

默认的标签

.class

em>.class

ul>.class

table>.row>.col

所有的

html 语法

css 语法