第二篇Bootstrap起步

我们可以在http://getbootstrap.com下载bootstrap的文件

点击左边的download bootstrap可以下载bootstrap的css,javascript和字体库的已编译版本。点击中间的download source可以下载bootstrap的源代码。一般情况下我们使用bootstrap点击左边的已编译版本下载就可以了。

如果下载的是已编译版结构是:

如果下载的是源代码结构是:

Dist文件夹里的内容和已编译版本内容一样.

如果需要使用bootstrap这个前端框架需要设置一些格式和引入一些文件,下面是使用Bootstrap的一个基本模板。

Bootstrap 使用了一些 HTML5 元素和 CSS 属性。为了让这些正常工作,需要使用 HTML5 文档类型(Doctype)。 因此,在页面的开头包含了以下代码段:

bootstrap模板为使IE6、7、8版本(IE9以下版本)浏览器兼容html5新增的标签,引入下面代码文件即可:

<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>

同理为使IE6、7、8版本浏览器兼容css3样式,引入下面代码

<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>

以下代码告诉IE浏览器,IE8/9及以后的版本都会以最高版本IE来渲染页面

<meta http-equiv="X-UA-Compatible" content="IE=edge">
 
以下代码可以让浏览器以最合适的大小来显示相应的页面:
<meta name="viewport" content="width=device-width, initial-scale=1">
 
要使用bootstrap来搭建网页,需要引入bootstrap的css文件,


<link href="~/bootstrap-3.2.0-dist/css/bootstrap.min.css" rel="stylesheet" />
 
若要使用bootstrap里的javascript组件还需要引入bootstrap的js插件,因为js插件是基于jquery的所以还要先引入jquery脚本,注意jquery脚本需要放到bootstrap的js插件前面。


<script src="~/bootstrap-3.2.0-dist/js/jquery.min.js"></script>

    <script src="~/bootstrap-3.2.0-dist/js/bootstrap.min.js"></script>

第二篇.Bootstrap起步的更多相关文章

  1. “MVC+Nhibernate+Jquery-EasyUI”信息发布系统 第二篇(数据库结构、登录窗口、以及主界面)

    “MVC+Nhibernate+Jquery-EasyUI”信息发布系统 第二篇(数据库结构.登录窗口.以及主界面) 一.在上一篇文章中,主要说的就是把主框架搭建起来,并且Nhibernate能达到增 ...

  2. ElasticSearch入门 第二篇:集群配置

    这是ElasticSearch 2.4 版本系列的第二篇: ElasticSearch入门 第一篇:Windows下安装ElasticSearch ElasticSearch入门 第二篇:集群配置 E ...

  3. Spring Cloud第二篇 | 使用并认识Eureka注册中心

    ​ 本文是Spring Cloud专栏的第二篇文章,了解前一篇文章内容有助于更好的理解本文: Spring Cloud第一篇 | Spring Cloud前言及其常用组件介绍概览 ​​ 一.Sprin ...

  4. [ 高并发]Java高并发编程系列第二篇--线程同步

    高并发,听起来高大上的一个词汇,在身处于互联网潮的社会大趋势下,高并发赋予了更多的传奇色彩.首先,我们可以看到很多招聘中,会提到有高并发项目者优先.高并发,意味着,你的前雇主,有很大的业务层面的需求, ...

  5. 从0开始搭建SQL Server AlwaysOn 第二篇(配置故障转移集群)

    从0开始搭建SQL Server AlwaysOn 第二篇(配置故障转移集群) 第一篇http://www.cnblogs.com/lyhabc/p/4678330.html第二篇http://www ...

  6. (转)从0开始搭建SQL Server AlwaysOn 第二篇(配置故障转移集群)

    原文地址:  http://www.cnblogs.com/lyhabc/p/4682028.html 这一篇是从0开始搭建SQL Server AlwaysOn 的第二篇,主要讲述如何搭建故障转移集 ...

  7. 深入理解javascript对象系列第二篇——属性操作

    × 目录 [1]查询 [2]设置 [3]删除[4]继承 前面的话 对于对象来说,属性操作是绕不开的话题.类似于“增删改查”的基本操作,属性操作分为属性查询.属性设置.属性删除,还包括属性继承.本文是对 ...

  8. 前端工程师技能之photoshop巧用系列第二篇——测量篇

    × 目录 [1]测量信息 [2]实战 [3]注意事项 前面的话 前端工程师使用photoshop进行的大量工作实际上是测量.本文是photoshop巧用系列第二篇——测量篇 测量信息 在网页制作中需要 ...

  9. 《javascript权威指南》读书笔记——第二篇

    <javascript权威指南>读书笔记——第二篇 金刚 javascript js javascript权威指南 今天是今年的196天,分享今天的读书笔记. 第2章 词法结构 2.1 字 ...

随机推荐

  1. (转载)MongoDB C#驱动中Query几个方法

    MongoDB C#驱动中Query几个方法 Query.All("name", "a", "b");//通过多个元素来匹配数组 Query ...

  2. 两个平行div之间有间隙

    两个平行的div使用 display: inline-block 会导致元素之间有空隙解决方法: 父元素设置 font-size: 0;

  3. python走起之第十三话

    前景介绍 到目前为止,很多公司对堡垒机依然不太感冒,其实是没有充分认识到堡垒机在IT管理中的重要作用的,很多人觉得,堡垒机就是跳板机,其实这个认识是不全面的,跳板功能只是堡垒机所具备的功能属性中的其中 ...

  4. 浅谈一下关于iscroll的使用心得

    因为最近的项目所有页面老板想做成苹果原生那种上下拉动有回弹效果的体验,浏览器自带是没有这种功能的,自己写的话兼容性可能会出大问题,要适配安卓的各种机型实在是难,所以我还是选择去使用移动端相对比较稳定的 ...

  5. 蒙特卡洛马尔科夫链(MCMC)

    蒙特卡洛马尔科夫链(MCMC) 标签: 机器学习重要性采样MCMC蒙特卡洛 2016-12-30 20:34 3299人阅读 评论(0) 收藏 举报  分类: 数据挖掘与机器学习(41)  版权声明: ...

  6. JOIN关联表中ON,WHERE后面跟条件的区别

    select * from td  left join (select case_id as sup_case_id , count(*) supervise_number from  td_kcdc ...

  7. Pattern Recognition for Cell-free DNA - Github

    一直都没有找到生信领域简单易懂的机器学习案例,这回算是逮到一个了:机器学习识别cfDNA OpenGene/CfdnaPattern

  8. 根据大小生成对应尺寸网络图片的网址(mark)

    当开发程序时,需要用到一些临时图片替代时,需要快速生成的话,以下的几个网址可提供帮助.mark一下,方便以后使用. http://lorempixel.com/http://placehold.it/ ...

  9. mongo 相关命令

    mongo导入数据: 1. 先进入找到mongo 安装目录 执行 ./mongo 进入mongo 2. mongorestore -u 用户名 -p 密码 -d 数据库 —drop 文件存在路径 显示 ...

  10. 数字图像处理作业使用OpenCV - 使用笔记

    数字图像处理作业的输入图像全部都是灰度图像,所以汇总一下自己遇到的问题答案. OCV的图像容器是Mat<typename>,可以用imread(filename)读取图像,filename ...