源码和笔记:http://pan.baidu.com/s/1c06RiMW
一.Bootstrap 概述
Bootstrap 是由 Twitter 公司(全球最大的微博)的两名技术工程师研发的一个基于HTML、CSS、JavaScript 的开源框架。该框架代码简洁、视觉优美,可用于快速、简单地构建基于 PC 及移动端设备的 Web 页面需求。Bootstrap 最为重要的部分就是它的响应式布局,通过这种布局可以兼容 PC 端、PAD
以及手机移动端的页面访问。
 
二.Bootstrap 特点
Bootstrap 非常流行,得益于它非常实用的功能和特点。主要核心功能特点如下:
(1).跨设备、跨浏览器
可以兼容所有现代浏览器,包括比较诟病的 IE7、8。当然,本课程不再考虑 IE9 以下浏览器。
(2).响应式布局
不但可以支持 PC 端的各种分辨率的显示,还支持移动端 PAD、手机等屏幕的响应式切换显示。
(3).提供的全面的组件
Bootstrap 提供了实用性很强的组件,包括:导航、标签、工具条、按钮等一系列组件,方便开发者调用。
(4).内置 jQuery 插件
Bootstrap 提供了很多实用性的 jquery 插件,这些插件方便开发者实现 Web 中各种常规特效。
(5).支持 HTML5、CSS3
HTML5 语义化标签和 CSS3 属性,都得到很好的支持。
(6).支持 LESS 动态样式
LESS 使用变量、嵌套、操作混合编码,编写更快、更灵活的 CSS。它和 Bootstrap 能很好的配合开发。
 
三、创建第一个Bootstrap 页面
1、Bootstrap 所依赖的js和css文件,第一个Bootstrap 程序
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>Bootstrap 介绍</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body>
<button class="btn btn-info">haha</button>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>

2、对应的页面效果

Bootstrap(1) 概述与环境搭建的更多相关文章

  1. 01_Struts2概述及环境搭建

    1.Struts2概述: Struts2是一个用来开发MVC应用程序的框架. Struts2提供了web应用程序开发过程中一些常见问题的解决方案; 对用户输入的数据进行合法性验证 统一的布局 可扩展性 ...

  2. 写给前端同学的C++入门教程(一):概述和环境搭建

    说明:本人是前端er,因为最近对 UE4(一个游戏开发引擎)产生了兴趣,而这个引擎源开发游戏时需要用到 C++ ,所以就开始入坑 C++ 了.现将自己学习 C++ 的笔记整理并分享出来,以便一些想入门 ...

  3. MongoDB副本集学习(一):概述和环境搭建

    MongoDB副本集概述 以下图片摘自MongoDB官方文档:http://docs.mongodb.org/manual/core/replication-introduction/ Primary ...

  4. 接口自动化:HttpClient + TestNG + Java(一) - 接口测试概述+自动化环境搭建

    1.1 接口测试简介 1.1.1 什么是接口测试 开始学习接口自动化测试之前,我们先要来了解什么是接口,以及什么是接口测试. 我们都知道,测试从级别上划分可以分为 组件测试 集成测试 系统测试 验收测 ...

  5. Linux入门第一天——基本概述与环境搭建

     一.Linux简介 1.历史 Linux内核最初只是由芬兰人李纳斯·托瓦兹(Linus Torvalds)在赫尔辛基大学上学时出于个人爱好而编写的. Linux是一套免费使用和自由传播的类Unix操 ...

  6. 001_Java概述与环境搭建

    Java由来: SUN公司开发,95年推出,96年推出JDK1.0版本 09年被Oracle(甲骨文)收购 詹姆斯·高斯林被称作“Java之父” JavaSE:Java Standard Editoi ...

  7. bootstrap环境搭建

    Bootstrap 是stwitter公司的两名前端设计师设计的基于html css javascript的超强的前端框架. Bootstrap 是一移动设备为优先,pc机,平板,手机皆适用的框架. ...

  8. 01-Hadoop概述及基础环境搭建

    1 hadoop概述 1.1 为什么会有大数据处理 传统模式已经满足不了大数据的增长 1)存储问题 传统数据库:存储亿级别的数据,需要高性能的服务器:并且解决不了本质问题:只能存结构化数据 大数据存储 ...

  9. JavaMaven【一、概述&环境搭建】

    课程概述 JavaMaven[一.概述&环境搭建] JavaMaven[二.目录结构&HelloMaven] JavaMaven[三.常用指令] JavaMaven[四.坐标& ...

随机推荐

  1. jquery 设计的扩展---初级

    1. 写一个构造函数G,调用G 时,返回G上的fn 对象的init() 的实例 2.设置G.fn 的指向,使用G.fn 与G.prototype指向同一个对象 2.1 重写G.prototype 对象 ...

  2. 尚硅谷springboot学习20-web开发简介

    使用SpringBoot 1).创建SpringBoot应用,添加我们需要的模块: 2).SpringBoot已经默认将这些场景配置好了,只需要在配置文件中指定少量配置就可以运行起来 3).自己编写业 ...

  3. 用ADO操作数据库的方法步骤(ZT)

    http://www.cppblog.com/changshoumeng/articles/113437.html 学习ADO时总结的一些经验 用ADO操作数据库的方法步骤 ADO接口简介 ADO库包 ...

  4. Extjs4 上传图片并进行图片格式以及大小验证

    在做项目是遇到上传图片,并在前端限制图片上传的大小,下面就直接贴出主要的上传图片的代码,以及图片大小的验证,但前端没有验证图片的宽高验证 一.先创建出上传图片的组件,使用filefield组件 var ...

  5. 关于openwrt使用web升级提示固件版本不对的处理方法

    参考资料:https://blog.csdn.net/caoshunxin01/article/details/79355602 当openwrt使用web升级提示固件版本不对: The upload ...

  6. gparted增加Ubuntu14.04根目录空间(转)

    转自:https://blog.csdn.net/t765833631/article/details/79031063 在win7上装了Ubuntu14.04双系统后,突然发现ubuntu开机会弹出 ...

  7. Oracle监听程序未启动或数据库服务未注册到该监听

    oracle新建数据库的时候提示Could not find appropriate listener for this database要做的操作如下: 1.查看netmanager里面的liste ...

  8. css flex 兼容ios android--商品展示 添加购物车

    https://blog.csdn.net/u010035608/article/details/52711248 <!DOCTYPE html> <html> <hea ...

  9. 1.5.2、CDH 搭建Hadoop在安装之前(定制安装解决方案---使用内部包存储库)

    本主题描述如何在Cloudera Manager部署中创建内部包存储库和直接主机以使用该存储库.您可以创建永久或临时存储库. 完成这些步骤后,您可以安装特定版本的Cloudera Manager或在未 ...

  10. Flex Basis与Width的区别

    [Flex Basis与Width的区别] Flex Items的应用准则 content –> width –> flex-basis (limted by max|min-width) ...