Sublime text3 创建html模板

最近接手了公司官网跟新的任务,需要编写HTML页面。页面中存在大量重复内容(导航条、页脚、侧边栏等),每次复制粘贴也不是个事,网上搜了相关的HTML模板创建问题,还找到了。楼主使用的是Sublime text3,相关创建HTML模板的方法如下:

1. 使用相关的包,如SublimeTmpl,安装步骤如下:

    1.1 安装Package Control组件

    1.2 按下Ctrl + Shift + P调出命令面板,选择Install Package选项并回车

    1.3 输入要安装的插件,如SublimeTmpl

    1.4 安装成功后,使用Ctrl + alt + h就可以新建一个html5文件了。

    1.5 html5模板修改,点击Preferences → Browse Packages,在SublimeTmpl文件夹下,依次找templates→html.tmpl进行修改。

2. 自定义模板,步骤如下:

    2.1 打开工具--插件开发--新建代码片段,会出现下图:

    2.2 在<![CDATA[和]]>内写下你要的代码片段,注意的是代码片段要靠最左边,并把下面tabTrigger标签的注释打开,中间的yhdt就是你的快捷键。

    2.3 Ctrl+s保存,后缀必须是.sublime-snippet。例如yhdongtai.sublime-snippet

    2.4 新建一个页面test.html,输入yhdt,然后按Tab键,就出现你设置的代码片段了。

原文地址:https://www.cnblogs.com/yahengwang/p/9403560.html

时间: 2024-08-14 10:39:52

Sublime text3 创建html模板的相关文章

sublime text3创建文件时生成头部注释

在配置sublime text3编辑器在创建一个新的文件时,希望可以自动生成头部注释,在网上查了几个插件,主要有三个:DocBlokcr(https://packagecontrol.io/packages/DocBlockr).sublime tmpl(http://www.fantxi.com/blog/archives/sublime-template-engine-sublimetmpl/)以及FileHeader(https://github.com/shiyanhui/FileHea

Sublime text3 012 SublimeTmpl 自定义变量 和 模板变量

Sublime text3 012 SublimeTmpl 自定义变量 和 模板变量 ------------------------------------------------------------------------------如果有什么不明白的,加QQ群:186970878 经常会有错字 或 语句不通的,欢迎联系本人,方便快速修正,也方便后来者阅读. 联系本人QQ: 2071551682-----------------------------------------------

MacOS中创建Sublime Text3快捷方式返回Operation not permitted的原因及解决

在类Unix系统中我们可以很随心的添加一些程序在终端里快捷方法,比如将一些常用的工具放在/usr/bin下面 Sublime Text3是一个小巧精致而又功能强大的程序,而且本猫也安装了Swift语言的语法包,对于一些天马行空一闪而过的的创意再也不用动用Xcode了.所幸的是在Sublime Text的程序包中作者早就添加了终端支持,其相对目录为: Contents/SharedSupport/bin/subl 我们只要将该文件做一个软连接到/usr/bin里就可以实现对任何文件快速用subli

为什么要选择Sublime Text3?

为什么要选择Sublime Text3? Sublime Text3 自动保存,打开图片 跨平台启动快!!!!多行游标,太好用. 插件,简直选不过来. 代码片段 VIM兼容模式 菜单栏基础功能介绍 File:文档相关,新建文件,打开文件或文件夹等. Edit:文件编辑相关,复制,剪切等(CVS大法好).除此之外还有一些强大的功能. Selection:选择相关,帮助选择代码. Find:查找替换相关.这个和其它编辑器区别好像不大. Ctrl+F查找.Ctrl+H替换等. View:对Sublim

一个前端程序猿的Sublime Text3的自我修养

来源于:http://guowenfh.github.io/2015/12/26/SublimeText/ 详细设置 && 20+插件 本文章会在本人有插件或者设置更新时,进行不定时更新 2015-12-31更新:NO. 21 侧边栏同步编辑窗口底色插件.2016-04-06更新:代码片段:better-completions:主题:Material,Seti_UI:代码格式化:HTML-CSS-JS Prettify:vue语法高亮:Vue Syntax Highlight:Termin

如何优雅地使用Sublime Text3(转)

转自http://www.jianshu.com/p/3cb5c6f2421c/ Sublime Text:一款具有代码高亮.语法提示.自动完成且反应快速的编辑器软件,不仅具有华丽的界面,还支持插件扩展机制,用她来写代码,绝对是一种享受.相比于难于上手的Vim,浮肿沉重的Eclipse,VS,即便体积轻巧迅速启动的Editplus.Notepad++,在SublimeText面前大略显失色,无疑这款性感无比的编辑器是Coding和Writing最佳的选择,没有之一. 温情提醒:可以移步原文首链处

sublime text3的使用

本文介绍sublime text3的使用,至于安装请参考我的文章Sublime Text3+Golang搭建开发环境 这里以3.143的版本为例. 1.自定义字体: 跳出的窗口,进行修改. ,font_face 是设置字体类型,font_size是字体大小. 2.sublime插件 官方提供了很多插件:https://packagecontrol.io 由于这些插件的安装都需要安装插件管理包package control.前一篇文章已经讲解,这里不赘述.我们需要通过package control

Ubuntu16.04下使用sublime text3搭建Python IDE

本来是想用pycharm,但你看它的内存要求,我的虚拟机一共也就1G Vim太别扭了,就算有代码颜色,不能自动对齐,不能规范格式,跳转到函数定义,显示文档,要配置起来太费劲,所以就尝试着用sublime text3 来搭建Python IDE 安装sublime text3 目前最简单的方法是通过ppa安装,打开终端,输入以下命令: sudo add-apt-repository ppa:webupd8team/sublime-text-3 sudo apt-get update sudo ap

sublime text3安装 mac os汉化/常用模块

sublime text介绍: Sublime Text 是一个代码编辑器(Sublime Text 2是收费软件,但可以无限期试用),也是HTML和散文先进的文本编辑器.Sublime Text是由程序员Jon Skinner于2008年1月份所开发出来,它最初被设计为一个具有丰富扩展功能的Vim. Sublime Text具有漂亮的用户界面和强大的功能,例如代码缩略图,Python的插件,代码段等.还可自定义键绑定,菜单和工具栏.Sublime Text 的主要功能包括:拼写检查,书签,完整