bootstrap环境搭建

最新推荐文章于 2024-12-28 15:00:27 发布

原创最新推荐文章于 2024-12-28 15:00:27 发布 · 624 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#bootstrap

bootstrap学习专栏收录该内容

2 篇文章

订阅专栏

本文介绍如何安装Bootstrap并将其引入项目中。提供了两种方法：一种是下载完整的Bootstrap包并在本地使用；另一种是通过CDN直接引用。同时强调了引入jQuery的重要性。

一，bootstrap安装
1.下载完整版的bootstrap。
http://v3.bootcss.com

2.按照需求下载bootstrap，按需定制所需要的部分。

http://v3.bootcss.com/customize/

二,引入bootstrap
1.使用本地的bootstrap文件
如果想要稳定的使用bootstrap文件，即下载下来在本地项目中使用。
（1）将css文件放在bootstrap.min.css放在stylesheet专门放css的文件夹。把Js文件bootstrap.min.js放在类似script文件夹中。
（2）在页面中使用bootstrap
将bootstrap文件bootstrap文件引入到当前页面中，由于bootstrap基于jquery，所以引入js文件之前，一定先引入jquery.js.

<!-- Bootstrap 核心 CSS 文件 --></p>
<link rel="stylesheet" href="/stylesheets/bootstrap.min.css">

<!-- jQuery文件 -->
<script src="/scripts/jquery.min.js"></script>

<!-- Bootstrap 核心 JavaScript 文件 -->
<p><script src="/scripts/bootstrap.min.js"></script>

2.使用bootstrap cdn
如果网络环境还可以，而不想下载bootstrap。那么可以使用互联网上的cdn服务。

<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>