>http://www.ghugo.com/mobile-h5-fluid-layout-for-iphone6/ http://www.25xt.com/webapp/5802.html 2、`<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> `这句话必须有！ 3、该元素的margin，padding的px值除以该元素的父元素宽度px值，得出自适应元素适应的百分比！ 4、高度的百分比无效！，所以，换个角度，去设计它的padding或者margin的百分比就可以了！ 5、使用`@media only screen and (min-width : 320px) and (max-width: 360px){}`，这种方式进行某些调整！ 6、文字的text-indent和他的当前字体大小有关，单位为em或者rem为好！ 7、合理设计网页结构，外层应该完全适应包含里面的内容为好 **注意**：如下图：这时红色文字的margin-top负值！上移到黑色图片时，会出现两者总高度小与503px的情况！）  8、父元素设置了position：absolute或者relative，都不会阻止其内部的图片或者文字的自缩放！ 9、[谈响应式web设计代码实现](http://isux.tencent.com/code-of-response-web-design.html) 12、CSS Sprite背景图自适应  全部使用百分比，而且background-size属性一定要设置(且要放在background属性后面，否则没有效果)！ 对于背景图像background-size的理解： ~~~ <div class="m-tt">国际领先妇科技术 源自专业</div> <style> .m-tt { background-position-y: 20%; background-size: 13% 50%; (Xee:13%是相对包含元素的width的百分比，50%是height的百分比！) } </style> ~~~ ***** 13、暂时的理解：除了字体和高度使用rem之外，全部使用百分比（width，margin，padding） 11、使用百分数的时候，子栏目的所有属性(width、height、margin、padding等)都是根据父级栏目的宽属性（由书写方向改变）来设置的，如果是使用em的时候，子栏目都是根据他的父级栏目的字体大小设置的。 10、 **一个元素的 padding或者margin，如果值是一个百分比，那这个百分比是相对于其父元素的宽度而言的**，即使对于 padding-bottom（margin-bottom）和 padding-top（margin-top） 也是如此。 另外，在计算 Overflow 时，是将元素的内容区域（即 width / height 对应的区域）和 Padding 区域一起计算的。换句话说，即使将元素的 overflow 设置为 hidden，“溢出”到 Padding 区域的内容也会照常显示。 **所以：综上两条所述，我们可以使用 padding-bottom 来代替 height 来实现高度与宽度成比例的效果。** >**xee**：怎么来理解？看下图  *padding前*  *padding后* 可以看到“溢出”到 Padding 区域的内容也会显示！（padding的部分为浅绿色）