‍‍今天完成的事情：实践使用position、table和flex实现垂直居中的方法，学习了一种新的清除浮动方法，在慕课网学习雪碧图制作方法及原理。‍‍

‍‍明天计划的事情：结合task6抛开教程自己动手实践雪碧图制作，完成task6-1。‍

‍‍‍‍‍‍遇到的问题：暂无‍‍

‍‍收获：由于使用clear清除浮动在制作下拉菜单或制作阴影等有元素部分超出父元素的情况下会导致超出部分无法显示的问题，所以有个更好的新的清除浮动方法：‍‍clearfix‍‍技巧。‍‍‍‍‍‍‍‍‍‍

       ‍‍在父元素上使用‍‍‍‍“:before”和“:after”两个伪类。‍‍‍‍使用这些伪类，我们可以在浮动元素的父容器前面和后面创建隐藏元素（空元素）。“:before”伪类是用来防止子元素顶部的外边距塌陷，使‍‍‍‍用“display: table”创建一个匿名的“table-cell”元素。这也确保在IE6和IE7下具有一致性。“:after”伪类是‍‍‍‍用来防止子元素的底部的外边距塌陷，以及用来清除元素的浮动。‍‍

       相关代码：

‍‍‍‍                .box-set:before,.box-set:after {  content: ""; display: table;}‍‍

                .box-set:after {  ‍‍clear: b‍‍oth;}‍‍

       参考：http://www.w3cplus.com/css/advanced-html-css-lesson2-detailed-css-positioning.html