发表于: 2018-05-30 23:06:29
1 557
今天完成的事情:
任务八三个页面全部布局完成,并且做到了响应式。
重新学习了下grid的用法。
明天计划的事情:
把任务八的思维导图等工作收尾
开始任务10的学习
遇到的问题:
任务8,9都是对已有知识点进行布局,没遇到什么大的难点。
对:hover的用法突然断片
如果对一个元素设置了属性,想让他在鼠标悬浮在上方时显示出来,就给他的父级设置:hover
下拉栏出现问题,下拉时无法把内容往下挤。
但是页面一却可以
猜测应该是导航栏中有个属性影响了,所以会随着下拉菜单一起下滑。但另外两个页面没有。明天在看看。
收获:
今天用grid进行了布局。
对grid的用法有了更深的理解。
grid布局(CSS网格布局)是一种二维网格布局系统。
要想使用它就先要设计坐标轴:
grid-template-columns设置宽度
grid-template-rows设置高度
图中虚线就是坐标轴
设计了坐标轴后就要对盒子进行定位布局
grid-column: * / *;
grid-row: * / *;
通过以上属性对盒子进行在坐标轴中的定位。
以上四部是核心操作,然后就可以通过CSS给盒子里的内容添加样式。
进度:task8
任务开始时间:2018.5.22
预计结束时间:2018.5.31
是否有延期风险:无
禅道:http://task.jnshu.com/zentao/project-task-687.html
评论