发表于: 2017-04-01 20:31:43

1 596


今日所做:

1.开始做任务10,使用栅格系统去布局,做出响应式的效果;然后做到一半发现这个页面用栅格不太好调节

div之间的距离,然后尝试了用媒体查询去做,然后发现非常好用,同样也可以做出栅格变化的效果,还可以

对一些细节进行具体的设置。

2.第二行需要自己用div去做一个图形,先是做一个正方形的div,然后把border-radius设为50%,使之成为一个圆;

然后在内部设置一个div,不给高度,设置宽度和border,给父div设置display:flex;然后让内部div垂直水平居中;

但是发现内部div的宽度被父元素挡住了,出不来,然后给子元素div设置一个负值的margin,使内部div的宽度能够

穿过父div;最后还需要在两个元素中心加上一个数字,于是把数字加在子元素里,并使数字垂直水平居中,但是这样

数字会把它外面的div给撑开,这时需要给数字在加一个absolute属性,使脱离文档流,这样父元素就不会被撑开了。

3.完成了任务10页面的一半多

明日计划:

1.继续做任务十

2.对从拿到页面开始如何布局做一个总结

遇到的问题:

布局的时候没办法一次性想清楚,需要后期反复修改,还需多加总结,增加经验

今日收获:

1.学会如何用div去做一些简单的图形



返回列表 返回列表
评论

    分享到