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

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

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

　　一：引入bootstrap环境：

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

     <meta charset="UTF-8">

     <!--屏幕和设备的屏幕一致，初始缩放为1:1，禁止用户缩放-->

     <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">

     <title>bootstrap环境搭建</title>

     <!--引入外部的bootstrap中的css文件-->

     <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">

     <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->

     <script src="bootstrap/js/jquery.min.js"></script>

     <!--再引入bootstrap.min.js文件-->

     <script src="bootstrap/js/bootstrap.min.js"></script>

 </head>

      <body >

        <!--内容区-->

       </body>

 </html>

　　二：使用外部的bootstrap环境：

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Bootstrap环境搭建</title>

      <!-- 新 Bootstrap 核心 CSS 文件 -->

     <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">

     <!-- 可选的Bootstrap主题文件（一般不用引入） -->

     <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap-theme.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>

 </head>

       <body>

        <!--内容区-->

       </body>

 </html>

bootstrap环境搭建的更多相关文章

  1. visual studio code + Nodejs + Typescritpt + angularjs2 + bootstrap 环境搭建/Elementary os

    1.apt-get update 99% waiting for headers卡住了,fix如下 sudo apt-get clean cd /var/lib/apt sudo mv lists l ...

  2. 2_bootstrap的环境搭建

    2.bootstrap环境搭建 2.1.下载资源 中文官网地址:http://d.bootcss.com/bootstrap-3.3.5.zip http://www.bootcss.com 2.2. ...

  3. vue项目搭建和开发流程 vue项目配置ElementUI、jQuery和Bootstrap环境

    目录 一.VUE项目的搭建 1. 环境搭建 2. 项目的创建和启动 二. 开发项目 1. 配置vue项目启动功能 2. 开发vue项目 (1)项目文件的作用 (2)vue项目开发流程 (3)vue项目 ...

  4. AngularJs开发环境搭建

    1. 安装Sublime Text3 常用插件安装:AngularJs, Autoprefixer, BracketHighlighter,ConvertToUTF8,CSScomb,DocBlock ...

  5. eclipse+spket+Extjs4.2.1开发环境搭建

    一.开发工具配置   1.http://www.eclipse.org/downloads/下载Eclipse,解压.         2.http://spket.com/download.html ...

  6. appium 环境搭建 java

    1 安装node.js 1.1 安装node.js http://nodejs.cn/download/ 1.2.下载后直接点击exe,按照提示一步一步的安装 1.3 安装成功后,运行cmd,输入no ...

  7. 【ELK Stack】ELK+KafKa开发集群环境搭建

    部署视图 运行环境 CentOS 6.7 x64 (2核4G,硬盘100G) 需要的安装包 Runtime jdk1.8 : jdk-8u91-linux-x64.gz (http://www.ora ...

  8. ExtJS4.x 开发环境搭建

    需要的资源 ExtJS4.2 eclipse 开发环境搭建 在项目中国需要引用的文件: eclipse中有报错.需要处理的是ext-lang-zh_CN.js,中文编码不能识别.右键->属性-& ...

  9. Ext学习-HelloWorld以及基础环境搭建

    1.目的    在eclipse中搭建EXTJS的基础环境,学习如何按照从官方下载的代码中搭建新的Extjs工程 2.主要包含内容:   1.ExtJS文件下载以及目录说明   2.ExtJS开发环境 ...

随机推荐

  1. Python脚本实现Linux/MAC中Xmind Zen去水印等其他功能的过程（V0.1）

    说明本脚本仅作为学习使用,请勿用于任何商业用途.本文为原创,遵循CC 4.0 by-sa版权协议,转载请附上原文出处链接和本声明.功能简介 去除软件右上角激活按钮 去除导出时激活弹窗 去除导出PDF文 ...

  2. openresty开发系列10--openresty的简单介绍及安装

    openresty开发系列10--openresty的简单介绍及安装 一.Nginx优点 十几年前,互联网没有这么火,软件外包开发,信息化建设,帮助企业做无纸化办公,收银系统,工厂erp,c/s架构偏 ...

  3. ES6深入浅出-4 迭代器与生成器-4.总结

    yield的值就是外面调用next得到的值 ES6给的新的语法,如果你给任何一个对象添加一个Symbol.interator的key,同时它的值是一个生成器. 下面选中的就是生成器.生成返回的东西是迭 ...

  4. Qt编写气体安全管理系统5-数据监控

    一.前言 本项目对设备的监控有四种视图模式,可以任意切换,数据监控.地图监控.设备监控.曲线监控,其中数据监控是最常用的,所以在主界面导航中也排在第一位,综合观察分析了很多气体安全或者组态监控软件,大 ...

  5. 安卓 android studio 报错 Could not find com.android.tools.build:gradle:3.2.1.

    报错截图如下: 解决方法:在project的builde.gradle做如下操作分别加上google()

  6. 123457123456#2#----com.MC.DishuGame368----前拼后广--儿童打地鼠Game-mc2222222

    com.MC.DishuGame368----前拼后广--儿童打地鼠Game-mc

  7. 迅速解决！！！！！启动Tomcat报错PermGen space

    启动Tomcat报错   PermGen space    内存溢出 解决方法:扩大tomcat内存 修改参数:set JAVA_OPTS=-Xms1024m -Xmx1024m -XX:PermSi ...

  8. PP篇7 生产替代料齐套后处理

    扫描可关注本人技术分享公众号,与您一起学习新知! 对于计划订单和生产订单, 当存在替代料的时候,完成齐套性检查后,按照可齐套量进行拆单,并删除不能齐套的替代料(有个删除规则).不能齐套就按照优先级最高 ...

  9. 单独使用MyBatis的简单示例

    单独使用MyBatis的简单示例:mybaties-config.xml:MyBatis配置文件 <?xml version="1.0" encoding="UTF ...

  10. POJ 2342 Anniversary party 树形DP基础题

    题目链接:http://poj.org/problem?id=2342 题目大意:在一个公司中,每个职员有一个快乐值ai,现在要开一个party,邀请了一个员工就不可能邀请其直属上司,同理邀请了一个人 ...