发表于： 2020-03-28 21:01:07
2 1383
今日完成
学习使用纯css完成自动/手动轮播图
task8页面二使用checkbox制作的折叠菜单
task8页面三完成
明日计划
着手task10
了解less的使用方法
遇到的问题
在table表格这边卡了很久
第一次完成
有内边距 原因是使用的类名.card-body与bootstrap类名冲突 替换后正常
psd图中的中间竖线时分开的后使用width和colspan实验发现colspan可做到
由于需要自适应所以使用百分比做单位
薪资待遇右侧本想通过flex 使文字靠两端
使用flex后改变td原属性display:table-cell;导致宽度塌陷
遂改用两单元格完成
遇到的问题
整个卡片浏览器字适应
开始使用bootstrap格栅 但发现一行显示不同时卡片宽度不一样，且卡片间空隙不好处理
遂对卡片使用百分比%单位，并在卡片间添加空block间隔，配合媒体查询控制
完成效果
纯css手动轮播图
代码链接：https://github.com/Saxon-Liu/exercise/blob/master/banner.html
页面二移动端使用折叠菜单
checkbox配合transition过度
（在这里了解到transition对display无效）
收获
发现自己对表格这里知识点比较陌生，今天好好学习并实践了下
返回列表
评论