响应式网站笔记

1.页面检测
device.js

2.js控制style
document.documentElement.clientWidth 窗口宽度兼容ie6
onload 加载完成
onresize 调整尺寸
onscroll 滚动滚轮

3.视口
iphone中屏幕宽度是980
iphone分辨率1136*640 三星note3分辨率1920*1080 可是视口都是980
分辨率和视口没有关系

约束视口,content包含5个规则
<meta content="width=device-width, //命令视口的宽度，变为设备的宽(1024*768为标准,一般为320~380之间)
initial-scale=1.0,
minimum-scale=1.0,
maximum-scale=1.0,
user-scalable=no" //不容许用户缩放
name="viewport" id="viewport">

css3媒体查询(ie9开始支持)
<link rel="stylesheet" href="style1.css" type="text/css" media="(min-width:640px) and (max-width:750px)">

min-width max-width box-sizing:border-box
jqmobile适合开发功能较多的网站