发表于: 2018-08-19 23:08:50
1 698
1.今日完成的事
完成了任务8的首页大部分内容,还有底部的一丢丢没有写,写起来感觉和织毛巾一样。。。记录一下思路。首先看了下任务描述后,和师兄确认清楚任务9和任务8是一起的,只不过任务8是PC端高分辨率,任务9是移动端,所以这两个任务的总体目标是利用媒体查询响应式布局完成修真院这三个页面。然后确认好做两个样式,一个是大屏970px以上,一个是小屏幕970px以下,然后在这两个范围内能够自适应。确认好后就开始切图,然后就开始布局。。一开始就出了点小问题,昨天不是提出来了我用webstrom里面谷歌浏览器调试么,和实际的样式不一样,网上查了一下我清理了一下浏览器的缓存就好了。
这四个按钮在鼠标滑动过后会有一个下边框,但是边框是绘制在padding外面的,会导致导航栏下面多出来一点,这里就会导致鼠标滑动到按钮的时候下面的白色边框很突兀,这里我就用了box—sizing这个属性,定义为border。这样定义height就是这个盒子所有属性的高了,下边框也不会再导航栏外面也不突兀。但是不知道为啥。。下面的轮播图在鼠标滑动到按钮的时候上方会空出一点距离。。。怪怪的,我采用的是position定义为绝对就解决了。然后轮播图中间的问题,也要定义position为绝对才能叠加在轮播图上面,然后调整文字的样式就好了。但是在给的PSD文件里面这些字的字体都丢失了。
2.明天的计划
完成任务8的第二个页面。
3.遇到的问题
一开始轮播图花了会儿时间,后来自己多试了下就还好。后面也没啥问题。。都是之前遇到过一些居中问题,有些不清楚翻翻自己日报百度下就好啦~
4.收获
学会了怎么插入导航栏。
评论