发表于： 2018-04-25 17:53:11
1 492
本日进度：任务五
明日计划：了解一下bootstrap和雪碧图的概念。
了解到的知识：
1.定位：absolute绝对，relative相对，fixed固定
absolute和relative的参考物是整个页面，fixed则是当前浏览的窗口，
如果子元素被设置absolute时，父元素被设置relative，子元素的参考对象会变为父元素。
2.flex：对div设置display：flex后,其子元素会进入排序，设置后float，clear，vertical-align会失效。
此次用于div的垂直居中，使用了align-items属性，（备注，两种垂直居中方式，table-call和vetrical-align，absolute和transform，未使用过）
3.calc：格式为width:calc(100% - 1px)，－两边要有空格，用于确保在有margin的情况下，div占据100%的宽度。
4.box-size：border-box。将边框也算到宽度里。
一开始使用的是浮动，但是最后多行的时候，右边详细信息的div会跑到下边，然后向群里问到了calc，最后使用了flex，让左边垂直居中。
返回列表
评论