爱用bootstrap系列一:Sublime上写H5及运行
sublime上使用插件快速生成模板文件
第一,你要先下载package control的插件,这是一款用来管理插件的插件 。
可能会由于你所在的网络通过代理访问而导致安装失败,你可以通过下面的步骤来手动安装
点击菜单Preferences > Browse Packages
然后打开上一级文件夹到已安装的Packages所在文件夹 Installed Packages
从 https://sublime.wbond.net/Package%20Control.sublime-package 下载后,复制该文件到上面打开的目录
重启Sublime Text,完成对Package Control的安装
第二,记得要重新开启才能用。然后使用shift+Ctrl+ P来打开面板。下载一些插件,输入install,然后输入emmet,点击下载它,这个插件会提供一些小片段的快速生成代码,例如,
HTML文档需要包含一些固定的标签,比如<html>、<head>、<body>等,现在你只需要1秒钟就可以输入这些标签。
比如输入“!”或“html:5”,然后按Tab键:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
第三,bootstrap 3框架,这个是需要到网上去下载。
首先我们要知道,我们所有快速生成模板都是存放在preference—browse packages—user里面。


所以首先要去网站下载该插件https://github.com/JasonMortonNZ/bs3-sublime-plugin 然后解压存放到user文件中就可以使用
使用语句类似于bs3-template:html5即可以快速生成模板
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title Page</title>
<!-- Bootstrap CSS -->
<link href="//netdna.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<h1 class="text-center">Hello World</h1>
<!-- jQuery -->
<script src="//code.jquery.com/jquery.js"></script>
<!-- Bootstrap JavaScript -->
<script src="//netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
</body>
</html>
sublime上直接运行html文件
1,安装view in browoser


看左下角是否successed,成功了就可以设置快捷键啦
preference->key binding ,加入这句话:{ "keys": ["ctrl+shift+enter"], "command": "open_in_browser" },保存,使用ctrl+shift+enter就可以在浏览器上运行写好的html文件啦

爱用bootstrap系列一:Sublime上写H5及运行的更多相关文章
- 浏览器上写代码,4核8G微软服务器免费用,Codespaces真香
欢迎访问我的GitHub 这里分类和汇总了欣宸的全部原创(含配套源码):https://github.com/zq2599/blog_demos 一图胜千言 先上图,下面是欣宸在自己的iPad Pro ...
- USB系列之四:向U盘上写数据
在<USB系列之三>中,我们实现了一系列的SCSI命令,在这个系列中,我们要实现向U盘上写扇区的命令,所以,本文相对比较容易,更多地是给出一个实现的源程序. 在<USB系列之三> ...
- 反爬虫:利用ASP.NET MVC的Filter和缓存(入坑出坑) C#中缓存的使用 C#操作redis WPF 控件库——可拖动选项卡的TabControl 【Bootstrap系列】详解Bootstrap-table AutoFac event 和delegate的分别 常见的异步方式async 和 await C# Task用法 c#源码的执行过程
反爬虫:利用ASP.NET MVC的Filter和缓存(入坑出坑) 背景介绍: 为了平衡社区成员的贡献和索取,一起帮引入了帮帮币.当用户积分(帮帮点)达到一定数额之后,就会“掉落”一定数量的“帮帮 ...
- ASP.NET MVC使用Bootstrap系列(3)——使用Bootstrap 组件
阅读目录 Bootstrap 导航条 列表组 徽章 媒体对象 页头 路径导航 分页 输入框组 按钮式下拉菜单 警告框 进度条 小结 Bootstrap为我们提供了十几种的可复用组件,包括字体图标.下拉 ...
- 在github上写博客
在github上混了几个月,收获颇多.作为一个开源的坚定信仰者,深深觉得每一个码农都应该参与到开源社区中,github提供了一个平台,让你为开源项目提交代码变得异常简单和直接.以前由于工作异常繁忙和繁 ...
- Mac上写C++
用惯Windows的同学可能刚开始用Mac的时候并不知道如何写C++,我刚开始在Mac上写C++的时候也遇到过这个困扰,Mac上并没有Windows上自己用习惯的Visual C++,下面我分享一下个 ...
- [大数据从入门到放弃系列教程]在IDEA的Java项目里,配置并加入Scala,写出并运行scala的hello world
[大数据从入门到放弃系列教程]在IDEA的Java项目里,配置并加入Scala,写出并运行scala的hello world 原文链接:http://www.cnblogs.com/blog5277/ ...
- Git学习系列之Windows上安装Git详细步骤(图文详解)
前言 最初,Git是用于Linux下的内核代码管理.因为其非常好用,目前,已经被成功移植到Mac和Windows操作系统下. 鉴于大部分使用者使用的是Windows操作系统,故,这里详细讲解Windo ...
- BootStrap fileinput.js文件上传组件实例代码
1.首先我们下载好fileinput插件引入插件 ? 1 2 3 <span style="font-size:14px;"><link type="t ...
随机推荐
- 【MySql】脚本备份数据库
#!/bin/bash #this is a script of mysql backup #Mysql="mysql" #MysqlDump="mysqldump&qu ...
- 【转】【C#】迭代器IEnumerable和IEnumerator
迭代器模式是设计模式中行为模式(behavioral pattern)的一个例子,他是一种简化对象间通讯的模式,也是一种非常容易理解和使用的模式.简单来说,迭代器模式使得你能够获取到序列中的所有元素而 ...
- Android Studio 编写 JNI
之前一直都不知怎么编写JNI,今天刚好学习一下,感谢梦真的指教,以及提供的文档. 参考链接 http://blog.csdn.net/u011168565/article/details/518781 ...
- DTD与XML Schema都是XML文档。(选择1项)
DTD与XML Schema都是XML文档.(选择1项) A.正确 B.不正确 解答:DTD不是XML文件, schema是XML文档
- 【BZOJ】1061: [Noi2008]志愿者招募(费用流+数学)
http://www.lydsy.com/JudgeOnline/problem.php?id=1061 好神的一题! 学会了一种建模方式: 当方程组内的任意变量都在其中两个方程出现且一正一负,可以建 ...
- 【BZOJ】1662: [Usaco2006 Nov]Round Numbers 圆环数(数位dp)
http://www.lydsy.com/JudgeOnline/problem.php?id=1662 这道题折腾了我两天啊-!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! 果然 ...
- [NOI2008] 志愿者招募[流量平衡]
288. [NOI2008] 志愿者招募 ★★★★ 输入文件:employee.in 输出文件:employee.out 简单对比时间限制:2 s 内存限制:512 MB [问题描述] ...
- WEB安全番外第五篇--关于使用通配符进行OS命令注入绕WAF
一.通配符简介: 一般来讲,通配符包含*和?,都是英文符号,*用来匹配任意个任意字符,?用来匹配一个任意字符. 举个例子使用通配符查看文件,可以很名下看到打卡的文件是/etc/resolv.conf: ...
- spring boot 加载jsp
1.spring boot启动类继承SpringBootServletInitializer ,并且重写configure方法 package com.springapp.mvc;import jav ...
- django post 403解决之道(最新版Django)
写了一个方法,丢出一个post请求,发现报403 百度解决方案: 按提示及google结果修改setting.py,在MIDDLEWARE_CLASSES增加django.middleware.csr ...