Sublime Text 2 安装emmet插件和经常使用快捷键

时间 2019-11-13

标签 sublime text 安装 emmet 插件和经常使快捷键栏目 HTML 繁體版

原文原文链接

1、先安装package control
一、按Ctrl+`调出console，输入如下命令而后回车
css

import urllib2,os; pf='Package Control.sublime-package'; ipp=sublime.installed_packages_path(); os.makedirs(ipp) if not os.path.exists(ipp) else None; urllib2.install_opener(urllib2.build_opener(urllib2.ProxyHandler())); open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read()); print 'Please restart Sublime Text to finish installation'

二、安装成功后显示：Please restart Sublime Text to finish installation 重启

2、使用package control 安装emmet
一、按ctrl+shift+p,调出控制台
二、输入install，选择install package
三、弹出列表以后，在输入框中输入emmet，而后选择emmet插件进行安装。
安装过程当中会有介绍文件打开，安装结束后会有成功提醒。

3、测试安装是否成功，输入如下命令
html

<html>
div#cc>div.css>ul>li*4>a:link
</html>

按tab键，若是安装成功的话会出现如下代码，其中div能够省略，若是id或者class前面没有标签，默认就是div

<html>
<div id="cc">
	<div class="css">
		<ul>
			<li><a href="http://"></a></li>
			<li><a href="http://"></a></li>
			<li><a href="http://"></a></li>
			<li><a href="http://"></a></li>
		</ul>
	</div>
</div>
</html>

其余快捷方式：
java

输入html:5，按Tab或Ctrl+E键，看看发生了什么；
输入a，一样按Tab或Ctrl+E键，看看发生了什么；
输入div+p+bq

官方参考手册：http://docs.emmet.io/ 测试

经常使用快捷键：
一、多个重复对象，用*，如li*3
若是是重复多个对象，能够用括号，把不一样的对照组合成一个总体，好比table下面有多个tr，tr下面又有多个td，输入：tbody>(tr>td*4)*2，按tab，效果以下
ui

<tbody>
  <tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</tbody>

二、多个class赋给同一个对象，直接连着写就能够了,如 .class1.class2