单位
任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。为了简化font-size的换算，需要在css中的body选择器中声明Font-size=62.5%，这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。px,em,rem单位转换工具：pxtoem
rem是CSS3新增的一个相对单位（root em，根em）
px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。
em是相对长度单位。相对于其父元素来设置字体大小的
input TYPE
CSS3 media queries 媒体类型（Media types）
- all：匹配所有设备；
- handled：匹配手持设备（小屏幕、单色、带宽有限）；
- print：匹配分页媒体或打印预览模式下的屏幕；
- screen：匹配彩色计算机屏幕；
CSS3的媒体查询功能，能检测出移动设备的以下特性：
- min-device-width 和max-device-width：匹配设备屏幕的尺寸；
- min-width 和max-width：匹配视口的宽度，例如浏览器窗口宽度；
- orientation（值为portrait 和landscape）：匹配设备是横屏还是竖屏;
用户设备嗅探（User-agent sniff）
viewport
如果不设置viewpoint，网站在viewpoint就会显示成缩略形式。
weinre远程实时调试
WEb INspector REmote的简写，现在是Apache的一个开源项目。小苹果
AVD模拟器调试
弹性图片，让图片随视口缩放
网站的大图通常宽度都超过480像素，如果用前面的代码限制了缩放，这些图片在iPhone版显示显然会超过屏幕。好在iPhone机能还够，我们可以用CSS让iPhone自动将大图片缩小显示。img{max-width:100%;height:auto;}
image-set
这个属性用来支持Web前端人员解决不同分辨率下图片的显示，特别的（Retina屏幕）.用例见qq.com,taobao.com LOGO
background: url(http://gtms04.alicdn.com/tps/i4/TB1pEAeGFXXXXaQXFXXyTkXLpXX-500-444.png);/* 普通屏幕 */
background-image: -webkit-image-set(url(http://gtms04.alicdn.com/tps/i4/TB1pEAeGFXXXXaQXFXXyTkXLpXX-500-444.png) 1x,url(http://gtms01.alicdn.com/tps/i1/TB1sFgdGFXXXXXPXVXXsH1j1pXX-1000-888.png) 2x);/* Retina */
background-image: -moz-image-set(url(http://gtms04.alicdn.com/tps/i4/TB1pEAeGFXXXXaQXFXXyTkXLpXX-500-444.png) 1x,url(http://gtms01.alicdn.com/tps/i1/TB1sFgdGFXXXXXPXVXXsH1j1pXX-1000-888.png) 2x);
background-image: -ms-image-set(url(http://gtms04.alicdn.com/tps/i4/TB1pEAeGFXXXXaQXFXXyTkXLpXX-500-444.png) 1x,url(http://gtms01.alicdn.com/tps/i1/TB1sFgdGFXXXXXPXVXXsH1j1pXX-1000-888.png) 2x);
background-image: -o-image-set(url(http://gtms04.alicdn.com/tps/i4/TB1pEAeGFXXXXaQXFXXyTkXLpXX-500-444.png) 1x,url(http://gtms01.alicdn.com/tps/i1/TB1sFgdGFXXXXXPXVXXsH1j1pXX-1000-888.png) 2x);
阻止旋转屏幕时自动调整字体大小
html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 {-webkit-text-size-adjust:none;}