1.简介


Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,可以认为bootstrap就是一个样式库。

  • 它为开发人员创建接口提供了一个简洁统一的解决方案。
  • 它包含了功能强大的内置组件,易于定制。
  • 它还提供了基于 Web 的定制。
  • 它是开源的。

2.下载与文档说明


2.1 下载

  官方网站:http://getbootstrap.com/

  中文网站:http://www.bootcss.com/

  第三方网站:http://bootstrap.evget.com/

  学习网站:链接1   链接2

  前三个网站都提供了该框架的下载链接,并且有详细的说明与示例代码来介绍bootstrap的使用方法。第三方网站比较精简一些,可以快速上手。学习网站推荐使用链接1,链接2我们可以当作手册来使用,方便我们平时的查找。

2.2 文档说明

  版本:bootstrap-3.3.5-dist.zip

  

  css是bootstrap的核心部分,其中包括一下内容,其中bootstrap.css(含有注解)和bootstrap.min.css(不含注解)是我们经常长用到的,theme一般不使用。

  

  fonts:中放置了一些css中使用到的小图标

  js中提供了对下拉菜单,对话框的控制等等,如果我们要使用的话需要引入该文件

3.快速上手


  1.用dreamweaver新建一个HTML5工程,dreamweaver版本为CC 2015

  

  

  2.引入bootstrap

  

  

  引入成功

  

  3.如果要使用bootstrap中提供的js插件,我们首先的引入JQuery.js插件,下载地址

  

  

  引入成功

  

  4.细节处理

  修正网页在移动设备上的显示:

  在head标签中加入一下内容 <meta name="viewport" content="width=device-width,initial-scale=1"/>

  兼容低版本IE浏览器

  在head中加入

  <!--[if lt IE 9]>

    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>

  <![endif]-->

Boostrap(1)的更多相关文章

  1. Boostrap入门(一)

    1.第一步:下载Boostrap有关文件 Boostrap中文网:http://www.bootcss.com/ -->--> 2.第二步: 如下代码:引入相关文件即可. <!DOC ...

  2. Boostrap

    基本认知: Boostrap绝对是目前最流行用得最广泛的一款框架.它是一套优美,直观并且给力的web设计工具包,可以用来开发跨浏览器兼容并且美观大气的页面. Bootstrap的优缺点: 缺点: 1. ...

  3. 【转】Validate + Boostrap tooltip 表单验证示例

    一.工具准备: 1.boostrap: 下载地址 http://getbootstrap.com/ jquery: jQuery版本需大于或等于1.8.0  jquery.validate.min.j ...

  4. 用H5+Boostrap做简单的音乐播放器

    前言:这个是综合一下我最近在学的东西做的小Demo,到实际使用还有距离,但是用来练手巩固知识点还是不错的,最近在二刷JS书和Boostrap.css的源码,做完这个Demo也算是暂告一段落,接下来是j ...

  5. vue.js+boostrap最佳实践

    一.为什么要写这篇文章 最近忙里偷闲学了一下vue.js,同时也复习了一下boostrap,发现这两种东西如果同时运用到一起,可以发挥很强大的作用,boostrap优雅的样式和丰富的组件使得页面开发变 ...

  6. 我发现调用boostrap的弹框

    在引用了boostrap.js和boostrap.css之后 本来boostrap是基于jQuery的.但是我们的项目里没有用jQuery,而是用的zepto. 调用boostrap的弹框有两种方式: ...

  7. Boostrap栅格系统

    Boostrap排版.链接样式设置了基本的全局样式.分别是:为body元素设置 布局容器:Bootstrap需要为页面内容和栅格系统包裹一个:container容器.Bootstrap提供了两个作此用 ...

  8. boostrap中lg,md,sm,xs

    boostrap中lg,md,sm,xs分别表示多少px? .col-xs- 超小屏幕 手机 (<768px).col-sm- 小屏幕 平板 (≥768px).col-md- 中等屏幕 桌面显示 ...

  9. AngularJS Boostrap Pagination Sample

    首先,样式是这样的 首先,Service端是Webapi REST JSON格式 第二,我们建立一个Wrapper Class,这里你也可以定义一个Generic<T>,作为示例,我们这里 ...

  10. H5+Boostrap的音乐播放器

    H5+Boostrap做简单的音乐播放器 前言:这个是综合一下我最近在学的东西做的小Demo,到实际使用还有距离,但是用来练手巩固知识点还是不错的,最近在二刷JS书和Boostrap.css的源码,做 ...

随机推荐

  1. Android开发学习总结(一)——搭建最新版本的Android开发环境

    Android开发学习总结(一)——搭建最新版本的Android开发环境(转) 最近由于工作中要负责开发一款Android的App,之前都是做JavaWeb的开发,Android开发虽然有所了解,但是 ...

  2. Error && MFC

    Error:MSB6006 "rc.exe" exited with code 2. 目录含有中文 Error:no instance of overloaded function ...

  3. Storm 基础知识

    分布式的实时计算框架,storm对于实时计算的意义类似于hadoop对于批处理的意义. Storm的适用场景: 1.流数据处理:storm可以用来处理流式数据,处理之后将结果写到某个存入中去. 2.持 ...

  4. 数据库配置文件 conf.properties

    #数据库配置 #mysql hibernate.dialect =org.hibernate.dialect.MySQLDialect jdbc.driverClassName =com.mysql. ...

  5. NOIP2008 普及组T4 立体图 解题报告-S.B.S.(施工未完成)

    题目描述 小渊是个聪明的孩子,他经常会给周围的小朋友们将写自己认为有趣的内容.最近,他准备给小朋友们讲解立体图,请你帮他画出立体图. 小渊有一块面积为m*n的矩形区域,上面有m*n个边长为1的格子,每 ...

  6. 搭建appium的android环境

    首先需要准备: 1.jdk(步骤不再啰嗦) 2.android SDK,下载地址:http://developer.android.com/sdk/index.html,下载sdk tools,可能需 ...

  7. Centos7开启防火墙并且使MYSQL外网访问开放3306端口

    http://www.cnblogs.com/kreo/p/4368811.html CentOS7默认防火墙是firewalle,不是iptables #先检查是否安装了iptables servi ...

  8. 阿里巴巴Druid数据源,史上最强的数据源,没有之一

    目前常用的数据源主要有c3p0.dbcp.proxool.druid,先来说说他们Spring 推荐使用dbcp:Hibernate 推荐使用c3p0和proxool1. DBCP:apacheDBC ...

  9. uGUI练习(四) Light UI

    练习目标 在我之前的文章 Unity 2D Sprite Lighting ,讲到在2D Sprite中可以使用灯光,非常高兴的是,在Unity的新UI系统中我们也可以使用灯光 步骤 1.创建一个Pa ...

  10. Android 中JNI创建实例

    参考文档: http://blog.sina.com.cn/s/blog_a11f64590101924l.html http://www.cnblogs.com/hoys/archive/2010/ ...