将一个块级元素水平和垂直居中的方法有：
水平居中：
margin:0 auto;
display:flex; justify-content:center;
垂直居中：
display:flex; align-items:center;
什么是雪碧图？它的优缺点是什么？
CSS雪碧图即CSS Sprite（精灵），是一种网页图片应用处理方式。它是一种CSS图像合并技术：将小图标和背景图像合并到一张图片上，然后利用css的背景定位来显示需要显示的图片部分;简单说就是在一整张图片中分割出自己想要的部分，也可理解为图片截取显示（坐标的移动)，从而减少你的网站的HTTP请求数量。该图片使用CSS background和background-position属性渲染，意味着标签变得更加复杂了，图片是在CSS中定义，而非<img>标签。
优点：
①减少加载网页图片时对服务器的请求次数；
②提高页面的加载速度。
缺点：
①在图片合并的时候，你要把多张图片有序、合理的合并成一张图片，并且留好足够空间，防止板块内出现不必要的背景；在宽屏，高分辨率的屏幕下的自适应页面，如果图片不够宽，很容易出现背景断裂。
②CSS Sprites维护比较麻烦，如果页面背景有少许改动，一般就要改这张合并的图片，无需改的地方最好不要动，这样避免改动更多的css，如果在原来的地方放不下，又只能（最好）往下加图片，这样图片的字节就增加了，还要改动css
什么是行盒？行盒的特征、尺寸和定位？
行盒，即display属性为inline的元素。
常见行盒：文字元素：span、abbr、em、i、strong、b 图片和多媒体：img、video、audio
特征：
1.行盒可被折断，因为内容可被折断换行；
2.同一个包含块中，连续的多个行盒水平依次排列 ；
3.空白折叠的规则仅适用于行盒内部和行盒之间 ；
4.在没有css的干预下，行内元素并排显示，盒子沿着内容沿伸，宽高自动，盒子宽高不可设，若要调整行盒的宽高，应该使用字体大小、行高、字体类型，间接调整。
5.内边距（填充区）、边框、外边距，均是水平方向有效，垂直方向不会实际占据空间。因此，行盒与行盒之间的距离可使用水平方向上的margin和padding进行设置。
尺寸：
行盒可替换元素：图片和多媒体；
1.与块盒完全一致；
2.对于图片和视频，仅设置宽高中的一个时，另一个会自动按比例适应
位置：
行盒在包含块中，会避开浮动和常规流，浮动和绝对定位的盒子自动变为块盒； 包含行盒的块盒，可使用text-align调整行盒在它内容的对齐方式； 行盒之间的对齐可以使用vertical-align调整。