搭建Bootstrap离线文档的方法_javascript技巧

虽然现在不联网的情况很少,但在本机上搭建一份Bootstrap离线文档以备不时之需也是很有必要的。

废话不多说,如果你也有同样的想法,可以参照以下步骤来做:

若你还没有安装过nodejs和Ruby,请先下载安装后再开始下面的步骤。

去Bootstrap官网下载源码。

下载完毕之后解压到任意位置,比如D:\。

从terminal进入源码目录,输入命令:

npm install

接着从terminal输入下面的命令来安装Ruby的一个gem:Bundler(官网:http://bundler.io)

gem install bundler

如果你和我一样在安装bundler时碰到SSL错误, 请先运行下面的命令再重新安装bundler:

gem sources --remove https://rubygems.org/
gem sources --add http://rubygems.org/

若你在安装bundler时碰到过SSL错误,那么你还需要额外进行下面这一步骤的修改:打开源码根目录下的Gemfile文件, 把第一行的https:改成http,然后保存关闭。

修改Gemfile

从terminal进入源码目录,输入命令:

bundler install

至此,Bootstrap离线文档的安装配置已经完成,今后在想查看文档时,从terminal进入源码目录,输入命令:

bundler exec jekyll serve

打开网页http://localhost:9001 即可查看离线文档。

时间: 2024-10-25 21:26:17

搭建Bootstrap离线文档的方法_javascript技巧的相关文章

js导出table数据到excel即导出为EXCEL文档的方法_javascript技巧

复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu

JavaScript中输出信息的方法(信息确认框-提示输入框-文档流输出)_javascript技巧

js中输出信息的方法内容如下所示: 1.文档流输出 document.write('hello'); 2.输出信息提示框 模态对话框 window.alert('要输出显示的内容'); 或 alert('要输出显示的内容'); alert(n); 3.信息确认框 var f = window.confirm('是否要进入新浪网'); confirm(""); if(f){ location.href = 'http://www.sina.com.cn'; } 4.提示输入框 windo

BootStrap glyphicons 字体图标实现方法_javascript技巧

相关阅读: 详解Bootstrap glyphicons字体图标 先给大家说下什么是字体图标? 字体图标是在 Web 项目中使用的图标字体.虽然,Glyphicons Halflings 需要商业许可,但是您可以通过基于项目的 Bootstrap 来免费使用这些图标. 为了表示对图标作者的感谢,希望您在使用时加上 GLYPHICONS 网站的链接. 使用bootstrap很久了,内置的 glyphicons 图标,足以满足 小型项目的需求.只需要使用一个样式,即可调出图标.虽然感觉很神奇,一直没

Bootstrap中CSS的使用方法_javascript技巧

Bootstrap 使用了一些 HTML5 元素和 CSS 属性,所以需要使用 HTML5 文档类型. <!DOCTYPE html> <html lang="zh-CN"> ... </html> 为了让 Bootstrap 开发的网站对移动设备友好,确保适当的绘制和触屏缩放,需要在网页的 head 之中添加 viewport meta 标签,如下所示: <meta name="viewport" content=&quo

原生javascript实现解析XML文档与字符串_javascript技巧

之前写过一篇 <使用jquery解析XML的方法>链接是http://www.jb51.net/article/54842.htm,上篇文章详细解释了jQuery 与字符串互相转换的方法 ,这里着重论述javascript操作xml. 总代码如下: var XMLHttp = null; if (window.XMLHttpRequest) { //现代浏览器 XMLHttp = new XMLHttpRequest(); } else if (window.ActiveXObject) {

Javascript Ajax异步读取RSS文档具体实现_javascript技巧

RSS 是一种基于 XML的文件标准,通过符合 RSS 规范的 XML文件可以简单实现网站之间的内容共享.Ajax 是Asynchronous JavaScript and XML的缩写.通过 Ajax 技术可以经由超文本传输协议(Http) 向一个服务器发出请求并且在等待该响应时继续处理另外的数据.通过 Ajax 技术可以很容易实现读取远程 XML文件,因此,可以使用 Ajax技术实现远程访问依据 RSS 标准生成的摘要信息,甚至我们可以自己写一个 RSS 阅读器.         Ajax

Bootstrap 实现查询的完美方法_javascript技巧

Bootstrap,来自 Twitter,是目前最受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷. 废话不多说了,直接给大家贴bootstrap实现查询的代码了.具体代码如下所示: <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE html&

bootstrap网页框架的使用方法_javascript技巧

本文为大家分享了网页框架bootstrap的简单使用方法,供大家参考,具体内容如下 直接百度bootstrap可以搜到bootstrap中文网站,然后最好建议选择下载源码. 下载完成后,将dist/css/bootstrap.min.css复制到项目的根目录下. 具体的模块介绍和使用在中文网站上都有讲述,这里以制作的一个简单示例为例: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&

bootstrap日历插件datetimepicker使用方法_javascript技巧

如何使用bootstrap日历datetimepicker插件? 一.引入文件 1.css样式 <link href="/css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen"> 2.js文件 <script type="text/javascript" src="/js/bootstrap-datetimepick