发表于： 2019-06-16 23:07:16
3 848
今天完成的事情
完成了任务8第二个页面的布局，中间内容看似简单，但是缩放时媒体查询，很多细节都要修改，比如一些margin、widht的%等，本想，第二个页面分两部分媒体查询，发现是远远不够的。也可能是我刚刚掌握运用不熟悉。
对flex项目属性的运用有所了解，对媒体查询运用有所小掌握。感受到了许多种布局的用处，比如flex的项目属性布局缩小时，可以渐渐减少两边的空白内容，与设置百分比宽度+媒体查询的效果不同。只是初步了解表达不清楚。
明天计划的事情
白天空闲看看第三个页面，构思一下布局，必要时直接复制第二个页面的页眉、导航栏与页尾。
遇到的困难
1.缩小宽度时，土豆网图片会被渐渐消失。解决思路：刚刚开始时想到了是否是 z-index 的问题结果敲了下还是没能解决问题，最后想到 flex 的项目属性，flex-shrink属性定义了项目的缩小比例，默认为1，即如果空间不足，该项目将缩小。最后flex-shrink：0 解决问题
2.在添加媒体查询中更更改改会出现很多无用代码，如何辨别出来并删除。
收获
对媒体查询运用加强
大盒子不设宽高，靠小盒子margin撑起宽高，媒体查询查询时，修改margin改变布局，这样就很容易。或者靠flex：1 0 auto控制也很方便。
返回列表
评论