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+数字键将当前屏移动到指定屏

 

转载于:https://www.cnblogs.com/cheryshi/p/7603339.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/399685.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

[C++学习历程]基础部分 C++中的函数学习

本文地址:http://blog.csdn.net/sushengmiyan/article/details/20305815 作者:sushengmiyan 一。静态变量: 局部变量是线程到达定义的地方的时候进行初始化,如果定义在函数中,那么每次函数调用的时候,都会进…

linux下安装Mysql(干货!!!)解决mysql 1130问题,远程登录问题

转载自:http://www.cnblogs.com/xxoome/p/5864912.html linux版本:CentOS7 64位 1、下载安装包“mysql-5.6.33-linux-glibc2.5-x86_64.tar.gz” # 安装依赖 yum -y install perl perl-devel autoconf libaio 2、把下载的安装包移动到/usr/local/下。…

Openstack Neutron : 安全

目录 - iptable:起源 - tables - chains - rules - 方向 - Security group 安全组: - Firewall 防火墙: - 更高的安全 - 无处安放的安全 - 公共安全 当业务从传统环境迁移到云上之后&a…

SQL语句汇总(三)——聚合函数、分组、子查询及组合查询

https://www.cnblogs.com/ghost-xyx/p/3811036.html SQL语句汇总(三)——聚合函数、分组、子查询及组合查询 拖了一个星期,终于开始写第三篇了。走起! 聚合函数: SQL中提供的聚合函数可以用来统计、求和、求最值等等…

iOS应用国际化教程(2014版)

本文转载至 http://www.cocoachina.com/industry/20140526/8554.html 这篇教程将通过一款名为iLikeIt的应用带你了解最基础的国际化概念,并为你的应用添加国际化的支持。该示例应用有一个标签和一个You Like?按钮,用户无论何时点击You Like?…

公众平台商户接入(微信支付)功能申请教程

场景及类型介绍 商家可以申请公众账号支付和APP(应用客户端)支付两种接入微信支付方式。 公众账号支付:用户在微信公众帐号内使用微信支付消费,案例:易迅、QQ充值。 APP(应用客户端)支付&#x…

wxPython python3.x下载地址

2019独角兽企业重金招聘Python工程师标准>>> wxPython python3.x下载地址 http://wxpython.org/Phoenix/snapshot-builds/ 转载于:https://my.oschina.net/laugh2last/blog/504688

爬山算法和模拟退火算法简介(转)

源:爬山算法和模拟退火算法简介 一. 爬山算法 ( Hill Climbing ) 介绍模拟退火前,先介绍爬山算法。爬山算法是一种简单的贪心搜索算法,该算法每次从当前解的临近解空间中选择一个最优解作为当前解,直到达到一个局部最优解。 爬山算…

How to connect oracle databse

1. 下載客戶端Oracle Developer Tools for Visual Studio_32bit 安裝后通過配置tnsnames.ora指定連接 C:\app\user name\product\11.2.0\client_1\Network\Admin\SERVER(DESCRIPTION(ADDRESS(PROTOCOLTCP)(HOSTIP Address)(PORT1521))(CONNECT_DATA(SIDSID))) 重啓后可以在VS20…

wordpress实现搜索页关键词高亮

http://www.hehaibao.com/wordpress-search-word-highlight/ 今天给网站搜索页加了关键词高亮功能&#xff0c;分享出来&#xff0c;希望对小伙伴们有所帮助。 实现效果如下图&#xff1a; 那么我们直接先上主要代码&#xff1a; 1 2 3 4 5 6 7 8 9 10 11<?php$s trim(ge…

数组和指针的区别

1、访问方式不同 ⑴数组的下标引用&#xff08;读一次内存&#xff09; char ary[5] "hello",c; ...... c ary[2]; ⑵对指针的引用&#xff08;读两次内存&#xff09; char *P,c; ...... c *p;   ⑶对指针进行下标引用&#xff08;读两次内存&#xff09; char…

SQL图像查看器 —— SQL Image Viewer

有时候往数据库里面存储了一些图片&#xff0c;但是如果不写读取程序的话&#xff0c;就不知道存储的对不对。 或者查看SQL数据库里面二进制看不懂&#xff0c;这个看图片很直观的。 就需要SQL Image Viewer这么一个?B的软件了 自己去找下载地址吧&#xff0c;我没有破解版。 …

wordpress插件使用教程 – 使用Google Language Translator 实现网站多语言在线翻译

https://www.wordpresshy.com/17600 在使用WordPress进行企业建站的时候会碰到一些网站需要中英双语言&#xff0c;这时候就需要WPML插件的使用。需要使用WPML进行网站翻译的站长可以点击查看以下文章 : WordPress中翻译网站&#xff08;WPML插件&#xff09;的使用 但是WPML的…

Oracle服务器连接

1 Oracle服务器的两类连接方式Oracle数据库连接有多种方式&#xff0c;按照客户端和服务器端是否同机运行可分成两大类&#xff0c;一是本地连接&#xff0c;二是通过网络连接。本地连接。顾名思义&#xff0c;就是客户端程序和服务器程序运行在同一台机器上。安装Oracle时&…

Object C学习笔记13-Dictionary字典

通过Array数组和Set集合的学习和理解&#xff0c;可以想象得到Dictionary也分为两种情况了&#xff0c;那就是可变和不可变两种类型的。的确如此&#xff0c;在Object C中提供了两个字典类&#xff0c;分别为NSDictionary 和 NSMutableDictionary. 在.NET中我们也学习过Diction…

零基础逆向工程24_C++_01_类_this指针_继承本质_多层继承

1 类内的成员函数和普通函数的对比 1.1 主要是从参数传递、压栈顺序、堆栈平衡来总结. 1.参数传递&#xff1a;成员函数多传一个this指针 2.压栈顺序&#xff1a;成员函数会将this指针压栈&#xff0c;在函数调用取出 3.堆栈平衡&#xff1a;普通函数是外平栈 对比图如下&#…

Wordpress基础:精简头部wp_head

https://www.cnblogs.com/tinyphp/p/5859167.html Wordpress基础&#xff1a;精简头部wp_head 在Wordpress里 <?php wp_head(); ?> wp_head()是一个重要的函数&#xff0c;它允许插件开发者向你的站点动态地添加CSS和javascript&#xff0c;如果我们不在模板中引入这…

Nodejs架构之json空处理

2019独角兽企业重金招聘Python工程师标准>>> 判断一个json是否存在某个对象。 正确的做法是 data {"mch_id":"12345678","hb_type":"NORMAL","hblist":"dddd"}; if(data ! null && data.hbli…

表达式求值及转换算法

2019独角兽企业重金招聘Python工程师标准>>> 后缀表达式求值算法 stack operands; //运算数栈 while(没到表达式尾) {scanf("一个运算对象op");if(op is 运算数)operands.push(op);else if(op is 运算符){operand_right operands.pop();operand_left o…

关东升的iOS实战系列图书 《iOS实战:传感器卷(Swift版)》已经上市

&#xfeff;&#xfeff;承蒙广大读者的厚爱我的 《iOS实战&#xff1a;传感器卷&#xff08;Swift版&#xff09;》京东上市了&#xff0c;欢迎广大读者提出宝贵意见。http://item.jd.com/11760248.html 欢迎关注关东升新浪微博tony_关东升。 关注智捷课堂微信公共平台&#…