今天完成的事情

任务六

明天计划的事情

端午出去玩

遇到的问题

收获

详细了解了下 rem 自适应  (媒体查询方式感觉麻烦所以主要看的是js的实现)

rem 相对于根节点 html 的 font-size 的百分比单位   如  html { font-size: 100px; }  则 1rem = 100px

html { font-size: 100px; }  设置100有两个原因  

一  换算很方便  1rem =  100px   我们把设计图中的像素直接除以100就换算成了rem   如  width: 36px =>   width: 0.36rem

二 为什么不是 10 而是 100   因为谷歌浏览器字体默认小于 12px 就不再缩放了  (所以字体设置 62.5%   (16-6)/16*100 = 62.5%   在谷歌浏览器也是有问题)

页面单位换成rem后  比例只需要控制根节点的字体大小就可以实现等比缩小或放大

自适应按比例缩放或放大(按 宽width 等比)  如设计稿是  750px * 1280px   浏览器可见区域宽度为 960px  则

960(浏览器可见宽度)/750(设计图宽度) * 100 = 128%(缩小或放大比例)

100(根节点字体大小) * 128%(缩小或放大比例) = 128px  也就算根节点  html { font-size: 128px; }

这里对字体的控制是JS实现的(  flexible.js 精简版  http://caibaojian.com/simple-flexible.html )

快12点了先提交了端午快乐

奥.. 看错了  是快11点了

........提交了任务才发现  使用bootstrap布局  醉