今天敲代码的时候,正好碰到这个问题.

与大家分享这个解决方法:

 
 

1/7

到bootstrap官方网站下载,对于我们开发者来说,直接下载编译和压缩后的CSS、JavaScript文件,另外还包含字体文件,但是不包含文档和源码文件。打开解压包之后可以发现包含三个文件夹 css、fonts、js。这是最基本的Bootstrap组织形式:未压缩版的文件可以在任意web项目中直接使用。我们提供了压缩(bootstrap.min.*)与未压缩 (bootstrap.*)的CSS和JS文件。字体图标文件来自于Glyphicons

 

 
 

2/7

所有Bootstrap插件都依赖jQuery。而且在正式的项目当中我们推荐使用压缩之后的版本,因为它的体积很小,到官网下载jQuery支持,如图:

 

 
 

3/7

将下载后的就jQuery放到bootstrap中的js目录下,如图:

 

 
 

4/7

在bootstrap的根目录下新建一个demo.html文件,(注意,必须在根目录下面新建,因为后面的步骤中要将bootstrap框架中的css和js文件链接到创建的demo中)

 

 
 

5/7

编辑demo.html文件,添加对bootstrap框架中css和js的引用,内容如下,图片有注释说明,这样,我们就基本上建立了对bootstrap框架的基本使用架构

 

 

6/7

另外,bootstrap官方提供了链接服务,永久免费,即使你不下载bootstrap框架文件到本地,也可以直接在html中使用,使用下面这段代码:

<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">

<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>

 
 

bootstrap框架怎么在html页面加载使用的更多相关文章

  1. AnjularJS系列4 —— 单个页面加载多个ng-App

    第四篇,插播, 单个页面加载多个ng-App 在写范例的时候发现的问题 一个页面有多个ng-app,angular只会处理第一个ng-app 需要加载两个ng-app,需要进行手动加载: angula ...

  2. JavaScript在A页面判断B页面加载完毕(iframe load)

    今天遇到一个需求,在A页面上判断B页面是否加载完毕(B页面是第三方页面),加载完毕时隐藏loading动画... 而平时我们一般做的事是在B页面上判断B页面是否加载完毕,进行操作. if(docume ...

  3. Pace.js – 超赞的页面加载进度自动指示和 Ajax 导航效果

    在页面中引入 Pace.js  和您所选择主题的 CSS 文件,就可以让你的页面拥有漂亮的加载进度和 Ajax 导航效果.不需要挂接到任何代码,自动检测进展.您可以选择颜色和多种效果,有简约,闪光灯, ...

  4. 解决JS文件页面加载时的阻塞

    关于页面加载时的时间消费,许多书中都做出了介绍,也提出了很多种方法.本文章就详细介绍XHR注入. 概述:JS分拆的方法 1.XHR注入:就是用ajax异步请求同域包含脚本的文件,然后将返回的字符串转化 ...

  5. JQuery Mobile页面加载处理

    在弄移动Web时采用了JQueryMobile框架. 奇怪的是 在使用页面加载 时 事件无效 我尝试了两种方法: $(document).ready(function(){ //do events } ...

  6. JQuery浮动层Loading页面加载特效

    之前做项目,经常需要一些浮动层加载Loading. 现在好多前端框架都能实现了,最常用的就是 artDialog 下面记录下当时的代码. <!DOCTYPE html PUBLIC " ...

  7. 从输入URL到页面加载的过程?如何由一道题完善自己的前端知识体系!

    前言 见解有限,如有描述不当之处,请帮忙指出,如有错误,会及时修正. 为什么要梳理这篇文章? 最近恰好被问到这方面的问题,尝试整理后发现,这道题的覆盖面可以非常广,很适合作为一道承载知识体系的题目. ...

  8. 转: web 页面加载速度优化实战-100% 的飞跃提升

    前言 一个网站的加载速度有多重要? 反正我相信之前来 博主网站 的人至少有 50% 在加载完成前关闭了本站. 为啥捏? 看图 首页完整加载时间 8.18s,看来能进来看博主网站的人都是真爱呀,哈哈. ...

  9. 深入浅出经典面试题:从浏览器中输入URL到页面加载发生了什么 - Part 3

    备注: 因为文章太长,所以将它分为三部分,本文是第三部分. 第一部分:深入浅出经典面试题:从浏览器中输入URL到页面加载发生了什么 - Part 1 第二部分:深入浅出经典面试题:从浏览器中输入URL ...

随机推荐

  1. P4842 城市旅行

    题目链接 题意分析 首先存在树上的删边连边操作 所以我们使用\(LCT\)维护 然后考虑怎么维护答案 可以发现 对于一条链 我们编号为\(1,2,3,...,n\) 那么期望就是 \[\frac{a_ ...

  2. 不支持这个操作系统WNT_6.3I_64

    安装winserver2012驱动时,经常会因为版本的关系,出现向后兼容问题: 编辑驱动安装配置ini, 添加向后兼容的标识即可:WNT_6.3I_64= Win81_64 删除system下的程序( ...

  3. golang (4) golang 操作mongdb

    1. 数据按照时间聚合操作 1.1 正常的数据结构 { "_id" : ObjectId("5cac8d7b1202708adf5d4b64"), " ...

  4. dede修改文章页命名规则

    一.DEDEcms  修改默认文章命名规则 1.单独添加分类默认修改,修改文件:include/common.inc.php. 大概在251行文档的命名规则 $cfg_df_namerule = '{ ...

  5. 虚拟机下设置CentOS 7使用固定IP地址

    1.设置虚拟机使用桥接网络 2.查看安装虚拟机软件的电脑IP信息 3.启动CentOS 7进行设置

  6. android:activity知识点

    一.活动流程 1.创建活动 public class firstActivity extends Activity{} 2.创建布局 新建first_layout.xml文件 3.注册活动 在andr ...

  7. IT人生的价值和意义 感觉真的有了

     为了做新闻APP,我居然短短一个月利用业余时间做了: 一个通用新闻采集器. 一个新闻后台审核网站. 一个通用采集器下载网站. 一个新闻微网站. 一个新闻APP, 而且还给新闻微网站和新闻 APP练就 ...

  8. vue构造器以及实例属性

    一.构造器 1.vue.js就是一个构造器,通过构造器Vue来实例化一个对象:例如:var vm = new Vue({}); 2.实例化Vue时,需要传入一个参数(选项对象): 3.参数:选项对象可 ...

  9. springboot-2-ioc

    在spring环境下, ioc(控制反转 和 DI (依赖注入) 是等效的, 主要体现一种组合的松耦合思想. spring Ioc容器负责创建Bean, 并将Bean注入到所需的Bean中, 有xml ...

  10. STL 排序(转载)

    这篇文章关于STL中的排序写的虽不深入,但是还是挺好的. 1.sort sort有两种形式,第一种形式有两个迭代器参数,构成一个前开后闭的区间,按照元素的 less 关系排序:第二种形式多加一个指定排 ...