bootstrap环境搭建

前端前端框架 bootstrap

创建时间:2019-09-15 14:32

字数:450 阅读:

　　Bootstrap 是stwitter公司的两名前端设计师设计的基于html css javascript的超强的前端框架。

　　Bootstrap 是一移动设备为优先，pc机，平板，手机皆适用的框架。

　　那么如何引入bootstrap呢?主要有两种方式(文档要求必须是 html5)：

　　一：引入bootstrap环境：

 1 <!DOCTYPE html>
 2 <html lang="zh-cn">
 3 <head>
 4     <meta charset="UTF-8">
 5     <!--屏幕和设备的屏幕一致，初始缩放为1:1，禁止用户缩放-->
 6     <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
 7     <title>bootstrap环境搭建</title>
 8     <!--引入外部的bootstrap中的css文件-->
 9     <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
10     <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
11     <script src="bootstrap/js/jquery.min.js"></script>
12     <!--再引入bootstrap.min.js文件-->
13     <script src="bootstrap/js/bootstrap.min.js"></script>
14 </head>
15      <body >
16        <!--内容区-->
17       </body>
18 </html>

　　二：使用外部的bootstrap环境：

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Bootstrap环境搭建</title>
 6      <!-- 新 Bootstrap 核心 CSS 文件 -->
 7     <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
 8     <!-- 可选的Bootstrap主题文件（一般不用引入） -->
 9     <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
10     <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
11     <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
12     <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
13     <script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
14 </head>
15       <body>
16        <!--内容区-->
17       </body>
18 </html>

转载请注明来源，欢迎对文章中的引用来源进行考证，欢迎指出任何有错误或不够清晰的表达。可以邮件至 2637574117@qq.com