Bootstrap 环境安装

2017-08-19 09:00:39 来源: 点击:站内收藏

Bootstrap 安装是非常容易的。本章将讲解如何下载并安装 Bootstrap,讨论 Bootstrap 文件结构,并通过一个实例演示它的用法。

下载 Bootstrap

您可以从 Bootstrap中文网 上下载 Bootstrap 的最新版本。当您点击这个链接时,您将看到如下所示的网页:

Bootstrap CDN推荐

本站实例采用的是百度的静态资源库(http://cdn.code.baidu.com/)上的Bootstrap资源。

百度的静态资源库的 CDN 服务,访问速度更快、加速效果更明显、没有速度和带宽限制、永久免费,引入代码如下:

<!--新Bootstrap核心CSS文件&-->
<link href="http://libs.baidu.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
你也可以下载下来放在项目目录中使用

点击下载Bootstrap3.3.7

HTML模板

一个使用了 Bootstrap 的基本的 HTML 模板如下所示:

<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 模板</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 引入 Bootstrap -->
<link href="http://libs.baidu.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
<!-- Bootstrap需要引入jQuery -->
<script src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script>
<!-- 包括所有已编译的插件 -->
<script src="http://libs.baidu.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<!-- HTML5 Shim 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 -->
<!-- 注意: 如果通过 file://  引入 Respond.js 文件,则该文件无法起效果 -->
<!--[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.3.0/respond.min.js"></script>
<![endif]-->
</head>
<body>
   <h1>Hello, world!</h1>
</body>
</html>
相关热词搜索:
评论正在载入