任务9

关于text-align: center

text-align 属性规定元素中的文本的水平对齐方式，设定center即为居中 ，作用在行内及inline-block元素上

IE盒模型和W3C盒模型的区别

IE盒模型中，宽高属性包括padding及border以及width/height
而在W3C盒模型中的宽高仅指content中的width/height

*{ box-sizing: border-box;}的作用

指定使用IE盒模型，其中为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制

inline-block特性，去除缝隙及顶端对齐

inline-block将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内，允许空格。即允许元素不换行但依然可以设计宽高及边距。
可以将font-size设置为0去除空隙，使用注释换行或者写成一行的方式也可以去除缝隙
使用vertical-align:top;可以实现不同高度的inline-block元素顶端对齐

CSS sprites

即CSS精灵图，将各种图标以排列组合的形式放到同一张图片上，在html中通过对精灵图的位移实现在视窗中显示特定图标以减少大独的图标文件产生的大量请求导致服务器压力增大且页面效率低下

隐藏元素

opacity: 0 ;透明度为0，整体
visibility: hidden;和opacity:0 类似
display:none;消失，不占用位置
background-color: rgba(0，0，0，0)

代码题

代码1
代码2