发表于: 2017-04-11 23:45:00

1 658


任务进展:

       1:仿照bootstrap栅格系统的思路,重写了栅格系统适应响应式。

       2:学习了JS引用类型。

       3:思考问题:13.1:因为各大浏览器存在兼容性问题,需要一个重置浏览器默认样式的文件保证在不同浏览器上CSS表现一致,文件是一些页面基本元素的属性设置,使用时在页面引入即可。resetting 无前提重置所有样式,无视任何 user agent 预置样式,normalizing 只做适当重置。

                    13.3:移动端常见六种布局方式:固定布局,流动布局,浮动布局,flex-box布局,混合布局,定位布局。

                    13.4:固定宽度开发webApp实现多终端下自适应:iphone上,指定viewpoint的width等于页面设计宽度;andriod上,根据公式target-densitydpi = UI-width / device-width * window.devicePixelRatio * 160计算得出target-densitydpi的值,指定到viewport中。

遇到问题:

       1:在重写栅格时发现自己的row和container高度塌陷,原因是没有清除浮动,自己加了overflow-hidden,查看bootstrap源码是用伪元素:after清除,相比之下,伪元素清除更合适,避免overflow在某些情况下出现的内容隐藏问题。

       2:学习了JS引用类型:Object类型,Array类型,Date类型和RegExp类型及其操作方法。学习exec()时对示例演示中pattern.lastIndex结果有些困惑,便将示例代码在chrome中运行了下,并查找资料,终于清楚。

明日计划:

       学习JS

收获:

       JS语言并不严谨,一些基本类型语法的使用会得出更大自由度的结果,在学习时要重点注意。


返回列表 返回列表
评论

    分享到