鲁中-O-华仔天翼云手机端「鲁中-O-华仔」

一：必读：响应式和自适应的区别：https://www.cnblogs.com/guozh/p/10163339.html                               二：rem 是如何实现自适应布局的： https://www.cnblogs.com/guozh/p/10163350.html

一：在头部加入代码

1.第一行： 这句话是自动设置缩放，然而，它并不能完全适应所有的手机，并且你在用浏览器手机模式调试的时候可能正常，但是换到真实的手机端其实是不正常的。所以我们还要进行改动。

2.第二行代码：

二：用rem替代px（代码方案一）   给根元素设置字体大小为20px。html,body{font-size:20px}, 要记得本js的1rem=40px哦

后面页面中所有的尺寸按照PSD上面量出来后除以40转换成rem单位的数值，注意是任何尺寸都要需要去除以40，这比第一种设置百分比按照父元素的宽度去计算方便很多。

a、图片需要设置宽和高，PSD量出来后除以40，少一个都不行，只设置一个图片会被拉变形。 b、做手机端页面时，清除margin和padding 用*可能清除不掉，需要加上标签名字去清除。 c、其他的按照正常的去做。

二：用rem替代px（代码方案二）  下面代码中的640指的是手机的屏幕宽度，所以这里用i=640指代屏幕的最大宽度，最小是320px，要记得本js的1rem=100px哦，其实是为了好换算，比如 font_size:14px;我们就可以写成，font_size:0.14rem。

三：也可以用Media实现

拓展---------------------------

浙江版权声明：本网信息来自于互联网，目的在于传递更多信息，并不代表本网赞同其观点。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，并请自行核实相关内容。本站不承担此类作品侵权行为的直接责任及连带责任。如若本网有任何内容侵犯您的权益，请及时联系我们，本站将会在24小时内处理完毕，E-mail：xinmeigg88@163.com