发表于： 2017-03-16 20:59:14
2 743
今天完成的事情：
完成了任务7的第三个页面。
将CSS编码规范过了一遍。规范的代码容易维护。
学会实现半透明的背景CSS样式。
background-color:rgba(255,255,255,0.15)<!--最后一个参数设置透明度，前面三个是RGB颜色值-->
学不定宽布局的过程中，复习了水平和垂直居中，水平居新学到了margin:0 auto;(需要指定居中元素的宽度)，或display:table与margin:0 auto;结合，或绝对定位与transform结合的方式。垂直居中新学了内联元素(inline或inline-block)与line-height，vertical-align:middle;结合的方式。
明天的计划：
如果任务7通过，就开始任务8。
遇到的问题：
解决方法：仍然将图片作为背景图导入，background-size控制图片比例大小，height和line-height一般是用来做单行居中效果，这里可以用来调整"卧底胜利"的垂直位置
.result-win-icon-col-word div {border: solid;font-size: 6vw;background: url(images/result_win.png) no-repeat;background-position: top;background-size: 40vw 22vw;line-height: 35vw;height: 23vw;}
收获：
感觉收获不多，强化bootstrap的栅格熟练度算是吧。
返回列表
评论