最近接手了公司官网跟新的任务,需要编写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键,就出现你设置的代码片段了。

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

  1. python学习笔记(六)---sublime text3 创建python项目

    1.创建项目 依次鼠标左键点击Project>Add Folder to Project...,选择test文件夹: 2.保存项目 依次鼠标左键点击Project>Save Project ...

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

    在类Unix系统中我们可以很随心的添加一些程序在终端里快捷方法,比如将一些常用的工具放在/usr/bin下面 Sublime Text3是一个小巧精致而又功能强大的程序,而且本猫也安装了Swift语言 ...

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

    来源于:http://guowenfh.github.io/2015/12/26/SublimeText/ 详细设置 && 20+插件 本文章会在本人有插件或者设置更新时,进行不定时更 ...

  4. 【网络资料】如何优雅地使用Sublime Text3

    如何优雅地使用Sublime Text3 Sublime Text:一款具有代码高亮.语法提示.自动完成且反应快速的编辑器软件,不仅具有华丽的界面,还支持插件扩展机制,用她来写代码,绝对是一种享受.相 ...

  5. 为什么要选择Sublime Text3?

    为什么要选择Sublime Text3? Sublime Text3 自动保存,打开图片 跨平台启动快!!!!多行游标,太好用. 插件,简直选不过来. 代码片段 VIM兼容模式 菜单栏基础功能介绍 F ...

  6. 如何优雅地使用Sublime Text3

    此文非原创,出处见文章结尾. 一.Sublime Text 3插件安装 优雅使用Sublime Text,插件则是不可缺少的存在:而插件的备份就显得非常的重要(譬如:各平台同步:更换系统/电脑,迅速使 ...

  7. Sublime Text3搭建PHP开发环境

    Sublime Text3搭建PHP开发环境 本文主要给大家分享了关于Sublime Text3搭建PHP开发环境 ,感兴趣的小伙伴可以做一下参考 一.Sublime text3安装 到官网http: ...

  8. 4.8 Sublime Text3 中配置 Python环境 --之下Sublime配置Python环境

    返回总目录 目录: 1.没有配置之前 2.安装Package Control插件 3.安装其他库: 4.配置其他操作: (一)没有配置之前: 我们试着运行以下,会效果怎么样? 1.首先选择Python ...

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

    转自http://www.jianshu.com/p/3cb5c6f2421c/ Sublime Text:一款具有代码高亮.语法提示.自动完成且反应快速的编辑器软件,不仅具有华丽的界面,还支持插件扩 ...

随机推荐

  1. 模块化(CommonJs、AMD、CMD、UMD)发展历史与优缺点

    全文主要整理自摘自<Webpack中文指南>(好文,建议直接去看,以下仅对该系列文章中的<历史发展>篇幅进行备份——也整理了点其他内容) 模块化 模块化是老生常谈了,这里不做阐 ...

  2. Linuxshell资料汇总

    1.判断文件是否存在 https://www.cnblogs.com/platero/p/4021561.html 2.日期赋值 https://www.cnblogs.com/lonelywolfm ...

  3. Never Go Away

    Hey if you ever want to leave it allif you ever want to lose control leave it all escape so far away ...

  4. android电池(五):电池 充电IC(PM2301)驱动分析篇【转】

    本文转载自:http://blog.csdn.net/xubin341719/article/details/8970363 android充电这块,有的电源管理芯片内部包含充电管理,如s5pv210 ...

  5. 剑指offer——扑克牌的顺子

    思想: 1.先将输入的几个数进行排序,sort函数是#include<algorithm>下的. 2.统计0的个数,以及相邻数的差值,比较0的个数及差值的和.看是否可以用大王填充中间的差值 ...

  6. memcached监控脚本

    #!/bin/bash . /etc/init.d/functions |wc -l` -lt ];then action "Memcached Serivce is error." ...

  7. Ci下面隐藏index.php的方法

    1.需要apache打开rewrite_module,然后修改httpd.conf的AllowOverride none 为AllowOverride All(里面,不同的环境目录不同) 2.在CI的 ...

  8. FileInputStream 把文件作为字节流进行读操作

    //把文件作为字节流进行读操作 FileInputStream in = new FileInputStream(filename);//FileInputStream具体实现了在文件上读取数据

  9. 1_Command 游戏开发命令模式

    A dead simple implementation looks like: ``` // simple void InputHandler::handleInput() { if (isPres ...

  10. yahoo的30条优化规则

    1.尽量减少HTTP请求次数 终端用户响应的时间中,有80%用于下载各项内容.这部分时间包括下载页面中的图像.样式表.脚本.Flash等.通过减少页面中的元素可以减少HTTP请求的次数.这是提高网页速 ...