发表于: 2021-12-15 20:53:33
1 1436
今天完成的事情:今天在做任务8 第一个页面技能树首页,运用栅格布局,上午主要做布局,昨天下午做的菜单部分,今天做的事中间内容部分,先是做自适应页面,全部页面均用到bootstrap的栅栏格布局,先做布局,然后在做的添加页面元素,布局利用栅栏格比较简单,主要困难在添加内部元素,比如图片,文字,背景,等 图片方面还要用到每张图片的位置调整,不平铺属性以及利用内外边距调整图片位置,文字方面主要在对齐方面,行多的会自动顶大row,行少的又留空白,所以不是很好调整 在用到 line-height 和font-size属性在测试的情况下完成文字的调整。在做最后一个footer时 对于二维码添加出现困难,总算是不能放到最后面,就算放到了也会顶大row使前面文本变形,最后利用定位解决了这个问题
明天计划的事情:做任务8的后两个页面,看起来都比第一个简单,计划明天全部完成
遇到的问题: bootstrap的栅格和w3cschool介绍的栅格,他们两个的值和语法能共用吗?“row-gap:1/3”
收获: 今天的任务里 用到了display: block;position: absolute;,挺好用 但是用不好也很容易变形。今天做的任务用的都是栅格,对栅格的理解更多了
评论