sublime 常用插件教程
<head>
<meta charset="utf-8">
<title>sublime 插件教程</title>
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
body {
background-color: ;
}
h1 {
background-color: ;
}
h2 {
background-color: ;
}
.red-biaoT {
color: #09094C;
}
.red-wenB {
color: #3B3BFB;
}
.red-wenB1 {
color: #77E4E4;
}
h1 {
font-family: Lobster, Monospace;
}
p {
font-size: 16px;
font-family: Monospace;
}
p.serif {
font-family: Arial Black, Gadget, color: #FFFFFF;
}
p.sansserif {
font-family: Arial, Helvetica;
}
</style>
<div> <!-- start:header-->
<a class="red-wenB1" href="https://www.w3cschool.cn/cssref/css-colors.html">CSS 256网络安全色</a>
<a class="red-wenB1" href="https://www.w3cschool.cn/cssref/css-colorsfull.html">CSS 颜色十六进制值</a>
<a class="red-wenB1" href="https://www.w3cschool.cn/cssref/css-websafe-fonts.html">CSS Web安全字体</a>
</br>
<img src="https://www.w3cschool.cn/statics/images/logonew2.png" width="206" height="36">
</div><!-- end:header-->
<div><!-- start:内容框架-->
<div><!-- start:大标题框架-->
<center><h1 class="red-biaoT">sublime 常用插件详细教程</h1></center>
</div><!-- end:大标框题架-->
<div><!-- start:小标题1框架-->
<h3 class="red-wenB">1.Emmet 插件</h3>
<ul id="nav1">
<li><strong>功能说明：</strong>Emmet是前端开发必备，HTML、CSS代码快速编写神器</li>
<li><strong>安装方法：</strong>Ctrl+Shift+P面板，安装插件</li>
<li><strong>使用方法示例：</strong>书写代码 ul#nav>li.item$*8>a{Item $} 再按Tap键</li>
</ul>
</div><!-- end:小标框题1框架-->
<div><!-- start:小标题2框架-->
<h3 class="red-wenB">2.JsFormat 插件</h3>
<ul id="nav2">
<li><strong>功能说明：</strong>JavaScript代码格式化</li>
<li><strong>安装方法：</strong>Ctrl+Shift+P面板，安装插件</li>
<li><strong>使用方法示例：</strong>在打开的JavaScript文件里点右键，选择JsFormat</li>
</ul>
</div><!-- end:小标框题2框架-->
<div><!-- start:小标题3框架-->
<h3 class="red-wenB">3.Compact Expand CSS Command 插件</h3>
<ul id="nav3">
<li><strong>功能说明：</strong>使CSS属性展开及收缩，格式化CSS代码</li>
<li><strong>安装方法：</strong>Ctrl+Shift+P面板，安装插件</li>
<li><strong>使用方法示例：</strong>按 Ctrl+Alt+[ 收缩CSS代码为一行显示，按 Ctrl+Alt+] 展开CSS代码为多行显示</li>
</ul>
</div><!-- end:小标框题3框架-->
<div><!-- start:小标题4框架-->
<h3 class="red-wenB"> 4.SublimeTmpl 插件</h3>
<ul id="nav4">
<li><strong>功能说明：</strong>快速生成文件模板</li>
<li><strong>安装方法：</strong>Ctrl+Shift+P面板，安装插件</li>
<li><strong>使用方法示例：</strong>SublimeTmpl默认的快捷键如下，如果快捷键设置冲突可能无效<br>
Ctrl+Alt+h --------新建 html 文件<br>
Ctrl+Alt+j --------新建 javascript 文件<br>
Ctrl+Alt+c --------新建 css 文件<br>
Ctrl+Alt+p --------新建 php 文件<br>
Ctrl+Alt+r --------新建 ruby 文件<br>
Ctrl+Alt+Shift+p ----新建 python 文件<br>
<br>
-相应的模板为tmpl格式的文件，它们保存在…\Sublime Text 3\Packages\SublimeTmpl\templates下,<br>
你可以根据自己的喜好来更改模板格式,例如把“html.tmpl”改为早期的html标准格式后保存
</li>
</ul>
</div><!-- end:小标框题4框架-->
<div><!-- start:小标题5框架-->
<h3 class="red-wenB">5.Alignment 插件</h3>
<ul id="nav5">
<li><strong>功能说明：</strong>使代码格式的自动对齐</li>
<li><strong>安装方法：</strong>Ctrl+Shift+P面板，安装插件</li>
<li><strong>使用方法：</strong>快捷键Ctrl+Alt+A，可能与QQ截图冲突，二者中的一个要重置快捷键</li>
</ul>
</div><!-- end:小标框题5框架-->
<div><!-- start:小标题6框架-->
<h3 class="red-wenB"> 6.HTML-CSS-JS Prettify 插件</h3>
<ul id="nav6">
<li><strong>功能说明：</strong>HTML、CSS、JS格式化</li>
<li><strong>安装方法：</strong>必须先安裝node.js,指定 node.exe 的执行档所在位置。进而安装HTML-CSS-JS Prettify,Ctrl+Shift+P面板，安装插件</li>
<li><strong>使用方法：</strong>默认快捷键：Ctrl+Shift+H,你也可以自行设置快捷键，菜单 “Preferences—> Key Bindings – User” 里新增</li>
</ul>
</div><!-- end:小标框题6框架-->
<div><!-- start:小标题7框架-->
<h3 class="red-wenB"> 7.SideBarEnhancements 插件</h3>
<ul id="nav7">
<li><strong>功能说明：</strong>侧栏菜单扩充功能</li>
<li><strong>安装方法：</strong>Ctrl+Shift+P面板，安装插件</li>
<li><strong>使用方法：</strong>打开在菜单栏view>sai bar>show sai bar，闭关在菜单栏view>sai bar>hide sai bar</li>
</ul>
</div><!-- end:小标框题7框架-->
<div><!-- start:小标题8框架-->
<h3 class="red-wenB"> 8.Bracket Highlighter 插件</h3>
<ul id="nav8">
<li><strong>功能说明：</strong>代码匹配，可匹配[], (), {}, “”, ”, ，高亮标记，便于查看起始和结束标记</li>
<li><strong>安装方法：</strong>Ctrl+Shift+P面板，安装插件</li>
<li><strong>使用方法：</strong>界面各处点看看</li>
</ul>
</div><!-- end:小标框题8框架-->
</div><!-- end:内容框架-->
</div> <!-- end:主体框架-->
浙公网安备 33010602011771号