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. Vue中的路由 以及默认路由跳转

    https://router.vuejs.org/ vue路由配置: 1.安装 npm install vue-router --save / cnpm install vue-router --sa ...

  2. typescript装饰器定义 类装饰器 属性装饰器 装饰器工厂

    /* 装饰器:装饰器是一种特殊类型的声明,它能够被附加到类声明,方法,属性或参数上,可以修改类的行为. 通俗的讲装饰器就是一个方法,可以注入到类.方法.属性参数上来扩展类.属性.方法.参数的功能. 常 ...

  3. Source Insight解决回车缩进过多问题

    摘自:https://jingyan.baidu.com/article/02027811339e651bcc9ce53c.html   新安装的Source Insight软件在编写代码时,回车换行 ...

  4. PL/SQL developer 开发小技能 and ash show command PL/SQL EXECUTE 以及注释

    ##sample  test windows 调试存储过程, 总体指导思想使用pl/sql test windows 调试存储过程,存储过程调试 可以用  run  to next exception ...

  5. Spring Boot 使用YAML配置

    YAML是JSON的一个超集,可以非常方便地将外部配置以层次结构形式存储起来.当项目的类路径中有SnakeYAML库(spring-boot-starter中已经被包含)时,SpringApplica ...

  6. mybatis 级联

    级联是一个数据库实体的概念.一对多的级联,一对多的级联,在MyBatis中还有一种被称为鉴别器的级联,它是一种可以选择具体实现类的级联. 级联不是必须的,级联的好处是获取关联数据十分便捷,但是级联过多 ...

  7. lombok插件/slf4j中字符串格式化

    大家在编写springboot项目的过程中可能会接触到lombok这个插件,这个插件可以在编译时帮我生成很多代码. 1.@Data生成Getter和Setter代码,用于类名注释 2.@Getter ...

  8. 【原生JS插件】LoadingBar页面顶部加载进度条

    先展示一下已经实现的效果: 预览地址:http://dtdxrk.github.io/js-plug/LoadingBar/index.html 看到手机上的浏览器内置了页面的加载进度条,想用在pc上 ...

  9. Selenium WebDriver原理

    WebDriver原理 WebDriver是按照Server-Client的经典设计模式设计的. Server端就是RemoteServer,可以是任意的浏览器,当我们的脚本启动浏览器后,该浏览器就是 ...

  10. robot:接口入参为图片时如何发送请求

    https://www.cnblogs.com/changyou615/p/8776507.html 接口是上传图片,通过F12抓包获得如下信息 由于使用的是RequestsLibrary,所以先看一 ...