发表于： 2018-08-07 23:16:19
2 632
今天完成的事情：
开始学习任务6
一、在使用flex布局时，发现子元素不能使用justify-self，导致水平居中无法实现，所以改用
justify-content: space-between;
实现布局，设置一个空白元素实现
.span-hidden {
margin: 0 1rem;
width: 2rem;}
header img {
margin: 0 1rem;
width: 2rem;
}
需要注意的是左右两端元素的width以及margin-left/right，padding-left/right要一致，即可实现分布
二、发现了原来写的任务6用的rem，于是重新复习了px em rem
px：ie浏览器不支持缩放
em：继承父元素的字体大小
rem：根据html比例的字体大小
总的来说rem的参照物最靠谱，所以用了rem
明天计划：
一、用bootstrap完成按钮组样式
二、学习下拉框的写法
三、学习雪碧图的引用方法
遇到的问题：
span重叠问题
收获：
看到任务时简单的布局有了清晰的思路，第一眼基本就能判断出该用什么代码，什么格式，多亏了万能的flex，真是好用
但是像任务6这种又是多行、又是缩进、左右还分开的布局就有点头疼
贴一下未完成的图
因为没往git上传分开切的小图，所以没有图
返回列表
评论