移动端适配(rem,vw/vh)巩固

187 阅读1分钟

rem适配

rem:长度单位(相对单位)

我们讲视口宽度的1/10,设置为根字号.所以我们需要使用媒体查询来帮助我们设置不同视口宽度下的根字号.针对这种情况手淘团队研发了一个可以自动帮我们设置不同视口宽度下的根字号(flexible.js),从而帮助我们更好的开发制动端.

适配高宽(单位rem)=设计稿截取的px值/根字号.

vw/vh适配(未来发展的趋势)

vw:也是长度单位(相对单位)

为我们将视口宽度(高度)的1/%=1vw(vh);

适配高宽(vw/vh):设计稿px值/视口宽度(高度)的1%;

vw/vh适配相对rem更为简单,方便;但各有各的好处;vw/vh,未来发展的趋势;

响应式网页开发(一般工作中很少会做响应式网页,成本高)

响应式网页既能使用在pc端也能使用在移动端,但成本很高

框架:Bootstrap来帮助我们更快的开发响应式网页.