分享好友 最新动态首页 最新动态分类 切换频道
sublime text 你所不知道的12个秘密
2024-12-26 11:54

package control安装

第一种方法是在控制台中复制粘贴代码按回车,https://sublime.wbond.net/installation

第二种办法下载pc文件,百度一下很多方案,这里不详说了


emmet安装

1、按Ctrl+Shift+P命令板

2、输入PCIC,回车进入Package Control:install

3、输入Emmet和Emmet Css

4、安装完毕以后,C+E就可以快速生成代码了


emmet的语法

2、轻松添加类、id、文本和属性 

p#foo      补充ID

p.foo       补充类

h1{foo}和a[href=#]     补充为<h1>foo</h1>    <a href="#"></a>


3、嵌套

>:子元素符号,表示嵌套的元素

+:同级标签符号

^:可以使该符号前的标签提升一行

效果如下图所示: 


4、分组

(.foo>h1)+(.bar>h2)


生成

<div class="foo">  
  <h1></h1>  
</div>  
<div class="bar">  
  <h2></h2>  
</div>  



5、定义多个元素 *

ul>li*3


6、定义多个带属性的元素

 ul>li.item$*3      $代表尾数不同1、2、3


7、Css快捷

1)w100  =》  width: 100px;  

2)p 表示%
      e 表示 em    
      x 表示 ex

h10p+m5e   =》  height: 10%;   margin: 5em; 

3@f

@font-face {  
  font-family:;  
  src:url();  
}  

4)模糊匹配

ov:h、ov-h、ovh和oh



你也可以在任意属性前加上“-”符号,也可以为该属性加上前缀。比如输入-super-foo: 


如果不希望加上所有前缀,可以使用缩写来指定,比如-wm-trf表示只加上-webkit和-moz前缀: 


前缀缩写如下: 

  • w 表示 -webkit-
  • m 表示 -moz-
  • s 表示 -ms-
  • o 表示 -o-

6)渐变 

输入lg(left, #fff 50%, #000)


7)其他参考

http://devework.com/emmets-css.html

https://www.douban.com/note/299285545/?qq-pf-to=pcqq.c2c


8、js代码提示

1)c+s+p

2)pcic

3)输入sublimeCodeIntel


9、sublime中安装编译sass


虽然PostCSS才是未来,但是Sass成熟稳定,拥有一大波忠实的使用者,及开源项目,且最近Bootstrap 4 alpha也从Less转到Sass了。所以了解Sass还是非常有必要的。

基于快速开发及效率,我开发环节习惯通过编辑器插件来完成Less/Sass编译,这样可以快速定位、修复Bug。

下面介绍一款Sublime Text的插件SASS build system for Sublime Text 2可以在编辑器完成Sass编译。名字是但Sublime Text 3可用无压力。

安装Sass

首先要安装Ruby和Sass,详细可参考:http://www.w3cplus.com/sassguide/install.html 或者网上大把教程,安装Sass的时候可能被墙不一定安装得上,所以可以退而求其次安装测试本版--pre。

Sublime Text安装Sass Build插件

1. 安装 Package Control Plugin

打开

输入

Sublime Text2
Sublime Text3

详见:https://packagecontrol.io/installation#st3

2. 安装 Package Control Plugin

 (Linux/Windows) 或 (OS X),然后输入'install'会看到并选择。

等待列表出来,输入会看到选择安装。

安装完成后, (Linux/Windows) or  (OS X)可编译Sass为CSS,还会有一个文件。

更多详细见官方:https://github.com/jaumefontal/SASS-Build-SublimeText2


10、安装多行注释插件

使用package control安装DocBlockr。安装完成后使用方法如下

A、先写完你的函数

 

B、然后在函数的前面一行,输入

C、然后回车,自动生成

 

D、并且在注释块中,按键可以展开关键词


12个小秘密

1) 选择

以下是一些Sublime Text选择文本的快捷键

  •  选中一个单词
  •  选中一行
  •  全选
    Ctrl + Command + M` 选中括号内所有内容 (编写CSS或JS时非常实用)

Sublime Text还支持一次选中多行的操作:Furthermore, Sublime Text brings lets us select multiple lines at once, which can significantly boost your productivity. There are several ways to perform this feature:

  •  按住键再点击想选中的行
  •  (选中部分文本时) 按此键选中所有相同文本
  •  (选中部分文本时) 直接选中下一次出现的该文本

CSS属性的顺序一般不重要,因为无论何种顺序浏览器都能正确渲染。但排序所有的属性还是有助于代码的整洁。在Sublime Text中,选中CSS属性后按就可以按字母顺序排序。

也可以使用 CSSComb 等第三方插件,更详细的控制排序的方法。

使用命令面板可以快速完成多重任务。按调出面板,键入需要的命令即可。看以下的几个示例

在同时打开多个标签页时,可以用以下的热键切换

  •  列出所有的标签页
  •  下一标签页
  •  上一标签页
  •  切换侧边栏显示的工程

同一个编辑操作可以在多个文件中同时重复。举个例子,多个文件中有同一段代码时,可用以下的步骤快速编辑

  1. 按在框中输入待查找的代码。可按快速使用选择中的代码段。
  2. 在框中指定需要查找的文件范围,或填写表示查找目前打开的文件。
  3. 在框中输入要替换成的代码,按按钮批量替换。

按可以列出文档中所有的CSS选择器。可以选择并立刻跳转查看。这个操作比使用一般的“查找”功能快得多。

如果你经常使用Sublime Text从事英文创作,那么启用拼写检查就非常有用处了。选择菜单,添加以下代码

SideBarEnhancements插件有效地改进了Sublime Text的侧边栏。安装插件后在侧边栏上点击右键,可以找到一下新功能:在资源管理器中打开、新建文件、新建文件夹、以…打开、在浏览器中打开。

:在浏览器中打开的热键是。

Sublime Text的外观主题可以更换。Soda Theme就是一个不错的主题,可以在包管理器中安装。

如果要安装的主题并不在在线软件仓库中,也可以手动安装

  1. 下载并解压缩主题包
  2. 点击菜单 
  3. 把主题文件夹复制到文件夹中.
  4. 点击菜单  并加入以下代码

不仅主题可以更换,图标也可以。在Dribbble上有大量重新设计的Sublime Text精美图标。更换方法

  1. 下载一个图标,有格式的最好。如果没有,用iConvert转换之。
  2. 终端执行
  3. 替换或文件。

如果在多台计算机上工作,同步选项设置应该是一个好主意。我们借用Dropbox完成这一任务。

首先在终端中运行以下命令上传设置文件

然后在所有需要同步的计算机上运行以下命令下载设置

使用小插件ClickableURLs可以让文件中的URL能够点击。

Sublime常见操作

1. 多光标操作只要按下Cmd(Windows系统下Ctrl)键,再用鼠标选择不同的行,你就可以同时编辑多行代码。

2. 重新打开关闭的标签和Chrome浏览器一样,如果你不小心关闭了一个页面,你只要按下Shift+Cmd+T(Windows下按住Shift+Ctrl+T)就可以重新打开该页面。如果你连续按这样的组合键,你就可以按照关闭的顺序重新打开它们。

3. 快速打开文件这可能是Sublime Text里我最喜欢的功能。按住Cmd+T(Wiondows系统下按住Ctrl+T)就会打开一个文本框,你可以在文本框内键入想打开的目标文件,系统就会在项目中搜索该文件的位置,这样你就可以不再用文件目录列表。

4. 跳转到符号如果你想快速跳到某个特定的符号,就按下Cmd+P(Windows系统下按住Ctrl+P)打开搜索框,键入目标符号,回车后就可以跳转至那个符号。

5. 在整个项目文档中搜索按住Shift+Cmd+F(Windows系统下按住Shift+Ctrl+F,在整个Sublime Text项目下搜索。

6. 在文字或行间跳转这更多的是操作系统的特点,但我是在使用Sublime Text过程中才发现的。在Mac上,如果你按住Alt键的同时使用方向键,那么能够实现单词而不是字符间的跳转。同样的,如果你按住Cmd键的同时使用方向键,就会跳转到这行的另一端。这非常适合在不用鼠标的情况下,快速在代码中定位。

7. 快速更改设置按住Shift+Cmd+P(Windows系统下按住Shift+Ctrl+P,可以快速启动查找,对Sublime Text的设置进行修改。
 



下面还有一些在看过黑客新闻评论后的补充

8. 在词间跳转按住Ctrl键,让光标在词间移动,这个是对驼峰式敏感的。假设目前光标位于“cakeParty”的词首,那么按住Ctrl,再按右方向键,就可以将光标移动到”e”和”P”之间。

9. 当前行上移或下移可以按下Ctrl+Cmd+Up/Down组合键,实现上移或下移当前行。

10. Sublime Package Control对主题、语法检查、代码校验等的安装非常有用。

11. 快速文字编辑按下Cmd+d选择当前文字,再次点击Cmd+d对所选文字进行编辑。它会方便重命名局部变量或是HTML标签。

12. 选中所有实例按住cmd+Ctrl+G选中所有实例。

13. 跳转到指定行按下Ctrl+G,然后输入行号即可。

14. 复制当前行按住Cmd/Ctrl+Shift+D,复制当前行。

还有一些常见操作可以点击链接,非常给力哦

http://www.lupaworld.com/article-248738-1.html


快捷键汇总


选择类

  • Ctrl+D 选中光标所占的文本,继续操作则会选中下一个相同的文本。
  • Alt+F3 选中文本按下快捷键,即可一次性选择全部的相同文本进行同时编辑。举个栗子:快速选中并更改所有相同的变量名、函数名等。
  • Ctrl+L 选中整行,继续操作则继续选择下一行,效果和 Shift+↓ 效果一样。
  • Ctrl+Shift+L 先选中多行,再按下快捷键,会在每行行尾插入光标,即可同时编辑这些行。
  • Ctrl+Shift+M 选择括号内的内容(继续选择父括号)。举个栗子:快速选中删除函数中的代码,重写函数体代码或重写括号内里的内容。
  • Ctrl+M 光标移动至括号内结束或开始的位置。
  • Ctrl+Enter 在下一行插入新行。举个栗子:即使光标不在行尾,也能快速向下插入一行。
  • Ctrl+Shift+Enter 在上一行插入新行。举个栗子:即使光标不在行首,也能快速向上插入一行。
  • Ctrl+Shift+[ 选中代码,按下快捷键,折叠代码。
  • Ctrl+Shift+] 选中代码,按下快捷键,展开代码。
  • Ctrl+K+0 展开所有折叠代码。
  • Ctrl+← 向左单位性地移动光标,快速移动光标。
  • Ctrl+→ 向右单位性地移动光标,快速移动光标。
  • shift+↑ 向上选中多行。
  • shift+↓ 向下选中多行。
  • Shift+← 向左选中文本。
  • Shift+→ 向右选中文本。
  • Ctrl+Shift+← 向左单位性地选中文本。
  • Ctrl+Shift+→ 向右单位性地选中文本。
  • Ctrl+Shift+↑ 将光标所在行和上一行代码互换(将光标所在行插入到上一行之前)。
  • Ctrl+Shift+↓ 将光标所在行和下一行代码互换(将光标所在行插入到下一行之后)。
  • Ctrl+Alt+↑ 向上添加多行光标,可同时编辑多行。
  • Ctrl+Alt+↓ 向下添加多行光标,可同时编辑多行。



  • Ctrl+J 合并选中的多行代码为一行。举个栗子:将多行格式的CSS属性合并为一行。
  • Ctrl+Shift+D  复制光标所在整行,插入到下一行。
  • Tab 向右缩进。
  • Shift+Tab 向左缩进。
  • Ctrl+K+K 从光标处开始删除代码至行尾。
  • Ctrl+Shift+K 删除整行。
  • Ctrl+/ 注释单行。
  • Ctrl+Shift+/ 注释多行。
  • Ctrl+K+U 转换大写。
  • Ctrl+K+L 转换小写。
  • Ctrl+Z 撤销。
  • Ctrl+Y 恢复撤销。
  • Ctrl+U 软撤销,感觉和 Gtrl+Z 一样。
  • Ctrl+F2 设置书签
  • Ctrl+T 左右字母互换。
  • F6 单词检测拼写



  • Ctrl+F 打开底部搜索框,查找关键字。
  • Ctrl+shift+F 在文件夹内查找,与普通编辑器不同的地方是sublime允许添加多个文件夹进行查找,略高端,未研究。
  • Ctrl+P 打开搜索框。举个栗子:1、输入当前项目中的文件名,快速搜索文件,2、输入@和关键字,查找文件中函数名,3、输入:和数字,跳转到文件中该行代码,4、输入#和关键字,查找变量名。
  • Ctrl+G 打开搜索框,自动带,输入数字跳转到该行代码。举个栗子:在页面代码比较长的文件中快速定位。
  • Ctrl+R 打开搜索框,自动带@,输入关键字,查找文件中的函数名。举个栗子:在函数较多的页面快速查找某个函数。
  • Ctrl+: 打开搜索框,自动带#,输入关键字,查找文件中的变量名、属性名等。
  • Ctrl+Shift+P 打开命令框。场景栗子:打开命名框,输入关键字,调用sublime text或插件的功能,例如使用package安装插件。
  • Esc 退出光标多行选择,退出搜索框,命令框等。



  • Ctrl+Tab 按文件浏览过的顺序,切换当前窗口的标签页。
  • Ctrl+PageDown 向左切换当前窗口的标签页。
  • Ctrl+PageUp 向右切换当前窗口的标签页。
  • Alt+Shift+1 窗口分屏,恢复默认1屏(非小键盘的数字
  • Alt+Shift+2 左右分屏-2列
  • Alt+Shift+3 左右分屏-3列
  • Alt+Shift+4 左右分屏-4列
  • Alt+Shift+5 等分4屏
  • Alt+Shift+8 垂直分屏-2屏
  • Alt+Shift+9 垂直分屏-3屏
  • Ctrl+K+B 开启/关闭侧边栏。
  • F11 全屏模式
  • Shift+F11 免打扰模式

sublime常用的插件

1、http://www.php100.com/html/it/focus/2014/1128/7935.html

2、http://www.oschina.net/translate/20-powerful-sublimetext-plugins?p=3#comments

最新文章
chatgpt多功能聊天机器人
ChatGPT多功能聊天机器人是一个基于人工智能技术开发的智能对话系统。它具备多种功能,可以用于娱乐、学习、办公等多个场景,为用户提供便捷的交流和帮助。ChatGPT多功能聊天机器人可以作为一个娱乐伙伴。它可以通过对话来陪伴用户,从分享
EasyData-V7.0-Update15
新增功能新增功能支持在指标平台中搜索指标系统的指标功能介绍:在指标平台的首页中,可以查看指标系统的热门指标等,也可以直接搜索指标系统的指标。点击指标名称后,可以直接跳转至指标系统的指标详情页进行查看新增功能1.【重点关注】离
2024年资料免费大全,实施验证方案AS822.387
  本文旨在为读者提供2024年的全面资料免费大全,并详细介绍实施验证方案AS822.387的步骤与要点。通过本指南,读者可以轻松获取所需信息,并确保数据验证的准确性与可靠性。  随着科技的飞速发展,信息的获取与处理变得尤为重要。为了
ai怎么设计服饰海报矢量图? ai设计海报图的教程
ai中想要设计服饰海报,该怎么设计这个海报呢?下面我们就来看看使用修饰文字工具将输入的文字进行修饰并制作成海报的教程。一、输入的文字进行修饰 1、新建一个空白文章,利用【文字工具】输入英文字母Garment Show。2、选择【修饰文字工
360清理大师会员版
360清理大师会员版能够轻松清理手机垃圾的软件平台,可以为手机提供安全的保护功能,保持良好的运行环境,使用起来更为的方便,有需求的小伙伴就此千万不要错过哦。随时可以满足用户的需求体验,清理手机上一些无用的垃圾。软件小马达,强
AI绘画
前言PREFACE这篇文章被大家催了2周了,今天才刚刚完成,抱歉抱歉,在上一篇《AI绘画 | Midjourney·商业应用·创意包装设计》我们探讨的是用AI来进行包装创意设计的,本文主要分享的是利用AI绘画和AI包装设计平台相结合,从包装模切图(刀
AI美女写真生成器全面评测:绝美效果配简单操作
在这个科技飞速发展的时代,AI技术早已渗透到我们生活的方方面面。而在令人期待的AI应用中,生成逼真的美女写真,成为了越来越多人的追求。想象一下,你只需轻松几步,就能生成一张美丽而又灵动的美女写真,仿佛这位少女从画纸上跃然而出,
7d影院加盟 7d影院加盟多少钱 身临其境7d互动影院加盟条件
一、具有优势,开创六个前茅:1、前茅家将3D游戏娱乐与动感影院技术巧妙结合;2、前茅家“可以玩的电影”,具有互动功能;3、前茅家既可以提供影院设备又可以提供影片内容的专业厂商;4、前茅家“四店合一”的影院,既可以播放7D电影,还可
AI 编码助手能否引领编程革命?一起探索 AI 对研发流程的变革
认为AI编码能帮助工程师解放哪些工作?第一:编码加速与自动化:1)代码生成,在实际的工作当中肯定会遇到一些比较难的逻辑代码,比如说根据格式”固定字符串“+”年月日时分秒“+随机数10位
6款塑造F1赛车的经典引擎!
让我们一同探索这些为赛车运动带来阵阵轰隆声的经典引擎。一级方程式赛车不仅是空气动力学的竞赛,同时也是车架竞赛与轮胎竞赛——但最重要的是它其实是一项动力竞赛。以下是我们为各位精选的六款经典引擎——不过我们其实能简单挑出至少20
相关文章
推荐文章
发表评论
0评