在 Emmet 的缩写语法里,给输出的元素添加 ID ,可以使用 # 号,再加上 ID 的名称 .. 添加类,可以使用 . ,再加上类的名称 …
div#message>div.alert.alert-success
一个 div 标签 … 上面有一个 message 的 ID ,在它里面是一个 div 类型的子元素 … 在这个子元素上,有两个类 … alert … 和 alert-success …
自定义属性
除了元素的 class 和 id 属性,输出其它的属性,可以把属性的名称和值放在一组方括号里 …
比如一个 a 标签 .. 在它上面添加两个属性 … alt 属性 … 还有 title 属性 … 把这些属性放在一组方括号里 … 属性之间用空格分隔开 …
可以先不为属性指定值 …
把光标放在这个句子的最后 … 然后按下 tab …
默认编辑的点会在一个属性值的引号里 .. 下一个编辑点是这个 alt 属性 … 有两个快捷键可以在不同的编辑点之间来回跳转…
跳到下一个编辑点上可以使用 alt+command+→ … windows 应该是 alt+ctrl+→
跳转到上一个编辑点,可以使用快捷键 alt+command+← … windows 上是 alt+ctrl+←
我们也可以直接指定属性的值 …
a[alt=hello title=hello]
在属性名字的后面可以直接指定属性的值 …
表单
再试一个 input 元素 … 可以使用 type 属性,指定它的类型 …
input[type=file]
这样可以在网页上添加一个上传文件的表单元素 … 它还有一个简单的形式 ..
input:file …
这个 input:file 还有一个更简单的形式 … 直接输入 input:f … f 就是 file 的简写 …
同样可以得到一个上传文件的表单元素 …
Emmet 为其它类型的 input 元素也添加了类似的简写形式 …. 比如 input:s … s 表示 submit … 这样会可以添加一个 type 属性是 submit 的 input 元素 …