本文共 1722 字,大约阅读时间需要 5 分钟。
emmet 是一个提高前端开发效率的一个工具。
emmet允许在html、xml、和css等文档中输入缩写,然后按tab键自动展开为完整的代码片段。一、Sublime Text 3 安装插件Emmet
点击菜单栏的首选项 ->Package Control -> 在弹出命令行中输入ip,在列表中点击“install Package” -> 弹出命令行输入框,输入“emmet”进行安装本人安装完后提示
Error while loading PyV8 binary:exit code 4 Try to manually install PyV8 from https://github.com/emmetio/pyv8-binaries 解决方法: 按提示打开https://github.com/emmetio/pyv8-binaries,选择自己版本下载pyv8,本人下载pyv8-win64-p3.zip。 点击Sublime Text 3菜单栏的首选项->浏览插件目录,打开Packages目录,再切换到上一层Installed Packages目录, 新建目录PyV8,把pyv8-win64-p3.zip解压后的文件放进去,重启ST编辑器。二、emmet的用法
emmet插件的官方文档: https://docs.emmet.io/abbreviations/syntax/新建一个html文件
1、元素 可以使用元素的名称(如DIV或P)生成HTML标记。 如输入div按tabl键后,自动生成<div></div>。 如果输入!,则自动生成一个HTML5基本结构Document
2、嵌套操作符
(1)子元素:>备注:div>ul>li的中间和后面不能有空格,否则按tab键后emmet 会停止解析,后面的例子也一样不能有空格。
(2)兄弟元素:+
-->
(3)向上一层:^,和>相反,可以多次使用
(4)乘法:*,重复指定次数生成元素
(5)分组:(),括号里面的内容为一个代码块,括号后面的元素与括号的第一个元素在同一级别
3、属性操作符
(1)id和class(2)自定义属性:[attr]
(3)项目编号:$
使用任意个$在数字前加任意个0
倒序,在$后面加@-
指定开始的序号,在$后面加@N,N为开始的序号
4、文本:{},为元素添加文本
Click me
因为文本也是节点,所以 a[href=1.htm]{click me} 与 a[href=1.htm]>{click me} 等价。
但是有多个元素时生成的结果会不同,用子元素>后面有元素时,也会放在a元素里面,例如clickhere clickhere
转载地址:http://eezrf.baihongyu.com/