响应式网站框架Bootstrap——概述

TwitterBootstrap：是一个简洁、直观、强悍的前端开发框架，让web开发更迅速、简单。由Twi...



Twitter Bootstrap：是一个移动设备优先的响应式Web框架。由Twitter的两个工程师开源的CSS框架，托管在github.com。国内镜像网站：www.bootcss.com。HTML：为H5已有标签扩展了自定义属性 data-*

CSS： （1）CSS Reset （2）定义了千个class

JS：基于jQuery创建了十几个插件函数

一、主要内容分为五部分

1.起步

2.全局CSS样式

3.组件

4.JavaScript插件

5.定制

二、初始化项目

        1.获取bootstrap文件

        英文官网：http://getbootstrap.com

中文官网：http://www.bootcss.com

        2.创建基础文件

        （1）设置语言

...  或 ，还可以是另外语言

作用：(1)用于为浏览器确定当前页面的自然语言，可基于此执行网页翻译操作

(2)为盲人的读屏软件确定页面的基础语言和发音

（2）IE8开启标准渲染模式

X-UA-Compitable：  Cross-UserAgent-Compitable

跨IE浏览器版本兼容性；此元标签仅对IE系列浏览器有效。

IE 6：特性不兼容行业标准

IE 7：尽可能的兼容更多行业标准，同时保留了一个IE6内核

IE 8：尽可能的兼容更多行业标准，同时保留了一个IE6/7内核

IE 9：尽可能的兼容更多行业标准，同时保留了一个IE6/7/8内核

IE 10：尽可能的兼容更多行业标准，同时保留了一个IE6/7/8/9内核

IE 11：兼容行业标准的大部分特性，同时保留了一个IE6/7/8/9/10内核

（3）配置视窗

width=device-width 宽度设置

height=height-viewport  高度设置

initial-scalel=1   初始缩放比例

user-scalabe=no  用户是否可以手动缩放

（4）引入bootstrap css样式文件

（5）引入jquery和其他js文件

若是希望低版本的IE支持h5和CSS3媒体查询技术，还需引入html5shiv.js和response.js

        html5shiv.js：自调函数，无需手工参与，由@afarkas @jdalton @jon_neal@rem编写，让老版本IE(

     4.基本模板

Bootstrap 101 Template

你好，世界！

    关注 古越子潺