响应式网站框架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
你好,世界!
关注 古越子潺
微信扫一扫关注公众号