Sublime Text 3 初试牛刀

每次我在其他视频网站上看学习视频的时候，看着老师用的编辑器高大上档次，而我一般用Notepad，和Dreamweaver去编辑网页，需要每一行代码，打进去，效率低。
最近看到sublime编辑器，在网上搜了一下说是最受欢迎的，就毫不犹豫的下载下来，初试牛刀一下下，把我搜索的功能和与前端浏览器交互的插件简答介绍一下。
前端实时可视化开发工具：LiveStyle

支持样式文件的修改，也可以在浏览器端编辑样式代码，会自动更新到你的样式表中。

浏览器端:

下载一个chrome浏览器，在 chrome网上应用店搜索LiveStyle添加至chrome。
可能会让你下载一个LiveStyle App，如果需要就下载，用的时候启动App就可以

Sublime端：
1.sublime官网下载地址：https://www.sublimetext.com/3
下载好了打开软件，点击Tool》command palette...>>pc.. 或者按Ctrl+shift+p，选择Install Package

等待一会，在弹出的install package输入框中输入livestyle并回车，等待几秒钟；就安装好了。

重启sublime，打开浏览器端的livestyle按钮就可以实现css可视化开发啦！

还有两种插件：browsersync，安装比较简单，可以实现任何文件的修改，只能在代码段修改，需要node.js配合使用，实现局部的刷新，对手机平板的实时交互效果很好。
browsersync：https://browsersync.io/

Livereload不仅支持样式，也支持所有文件的修改，只能在代码段修改，浏览器可以即时呈现。

Livereload：http://livereload.com/
Sublime快捷方法的应用

1.自动完成

自动完成的快捷键是Tab，如果在html文件中输入cl按tab或自动补全为class=“”；

2.多列编辑

按住Ctrl点击鼠标出现多个闪烁的光标可以同时修改多处，或者按住鼠标中间滑轮那个键拖拽选择多列。

3.代码注释功能：Ctrl+/,Ctrl+shift+/分别末行注释和块注释，再按一下就能取消，它可以识别html、css、js不同的文件

4.输入div.box>div.header+div.main+div.footer,并按下tab键会有神奇的代码段生成。

5.Ctrl+Shift+‘ 可以选择一对标签

6.Ctrl+D选择当前光标所在的词并高亮显示，再次点击出现下一个位置

7.Alt+R切换到正则匹配模式的搜索框，多文件搜索Ctrl+Shift+F

8.跳转

Ctrl+p会列出当前文件，输入文件名然后Enter跳转到该文件

Ctrl+G然后输入行号，回调到指定的那一行
9.打开多窗口编辑
编辑代码时，有时候会有好多页面关联，可以分屏。Alt+Shift+2进行左右分屏，Alt+Shift+8进行上下分屏；分屏之后，使用Ctrl+数字跳到指定屏，使用Ctrl+Shift+数字键将当前屏移动到指定屏

时间： 2024-10-19 21:27:01

Sublime Text 3 初试牛刀的相关文章

搜索引擎--范例：django之初试牛刀

这学期学了一门课<信息检索>,也就是传说中的搜索引擎 大作业自然而然的让我们自己做一个小型的搜索引擎.于是乎,我们本次的主题就诞生了 我也是边学边用,下面和大家一起分享我在这个过程中学到的东西,说的不对的请大家指正 这是我的成果搜索引擎--范例,大家可以点进去看看,点此下载所有文件盒源代码 按照流程,下面我给大家分享的依次是: 1:SAE创建新应用,SVN管理代码 2:新浪微博API获取最近的微博 3:中文分词算法的实现 4:谈谈django--mysql数据库的一些常用命令 搜索引擎--范例

OpenCV 初试牛刀——显示图像

作者 : 卿笃军 示例:从磁盘加载并在屏幕上显示一幅图像. #include "highgui.h" int main() { IplImage *img = cvLoadImage("1.jpg"); //将图像加载至内存 cvNamedWindow("初试牛刀--显示图像",CV_WINDOW_AUTOSIZE);//创建一个窗口 cvShowImage("初试牛刀--显示图像",img); //显示图像 cvWaitKe

初试牛刀：实时天气WebService

1.引入WebService:http://www.webxml.com.cn/WebServices/WeatherWebService.asmx 2.声明接口→界面获取值传入接口→接口返回值处理→输入 public string sWeatherHTML = ""; protected void Button1_Click(object sender, EventArgs e) { string txtCity=TextBox1.Text; cn.com.webxml.www.We

PyQt4 初试牛刀二

一.最小话托盘后,调用showNormal()后窗口不刷新,解决办法如下: 重写showNormal 方法,调用父类方法后,repaint窗体 def showNormal(self):     super(LcdTime, self).showNormal()     self.repaint() 二.透明显示窗口后无法拖动窗体: 必须拖动非透明区域,比如数字,目前没有找到好的解决方案. # -*- coding: utf-8 -*- import sys from PyQt4 import 

matlab初试牛刀__小练习

% T1 % 不妨设 h=2 D=1 clear,clc; h=2;D=1; x=-2*D:0.01:2*D; y=h*(x>D)+h/D.*x.*(abs(x)<=D)-h*(x<-D); % T_2 clear,clc; %用 cumsum函数 % A = (0:63); % B = cumsum(2.^A); % S = B(64) %用for循环 % clear,clc % s=0; % for i=0:63 % s = s+2.^i; % end % s %用sum函数 cle

u-boot，初试牛刀

手里拿到的uboot是uboot-2012,整个目录和之前的1.3.4没什么太大变化.但是系统启动初始化的流程,以及一些接口函数的定义变化了许多.以及初始化make的流程也变化,另外在nand的ecc校验算法增加了bch校验. 第一步,编译 linux下的编译,基本都是借用了Makefile和脚本以及链接文件协同合作,最后搞出来一个bin. 编译uboot也无外乎这样.只是稍微有些不同. 啥也不懂,啥也不知道怎么办? 那么make help 下吧,不识路,先问路. #make help Clea

openerp 初试牛刀 --项目开发重点 1

刚开始接触openerp的人肯定无从下手.实际上 你只要明白其中运行的大概原理 你便会使用它了. 首先我们看下 一般的目录结构: 对与英文不好的朋友 小编我也是免为其难的翻译下喽: addons/ |~idea/                   #这是模块的目录 |~demo/         #演示和单元测试的人口数据 |~il8n/              #字段翻译 |~report/ #报告定义 |~security /       #组织和访问权限的宣言 |~view/   #视

NLP初试牛刀，NLTK入门第一篇

之前下载过一个PDF,书名是<用python进行自然语言处理>,挺有意思的,加上NLP和机器学习目前大热,想趁着暑假涉猎一下.于是开始了入门NLP之旅. 安装环境:Ubuntu14.04桌面版,python版本:2.7 第一步:安装nltk,首先要安装pip工具:sudo apt-get install python-pip,安装完成后用pip安装nltk:sudo pip install python-nltk. 第二步:下载nltk所有的包,在终端中进入python的交互模式, >&

SpringBoot初试牛刀

新建 Spring Boot 项目常用的两种方式 你可以通过 https://start.spring.io/ 这个网站来生成一个 Spring Boot 的项目. 你可以选择自己喜欢的依赖进行加载到项目当中. Spring Boot 项目结构分析 成功打开项目之后,项目长下面这个样子 以 Application为后缀名的 Java 类一般就是 Spring Boot 的启动类,比如本项目的启动项目就是HelloWorldApplication .我们直接像运行普通 Java 程序一样运行它,由