本来是想用display:inline-block来水平方向对齐这三个元素的，结果没问题，但是最左边的元素是添加后添加的内容，出现如图的问题，元素上下偏移。解决办法查了很多文章，终于找到了问题的原因。是因为虽然设置了display:inline-block，但是三个inlineblock元素的基线没有对齐，导致第一个元素下沉的问题如图。解决方法如下：1.vertical-align使用vertical-align将元素的垂直准线对齐一个方向。在这里，我们可以简单地设置第一个元素的样式。item1{显示：内联块；//此处省略vertical-align:top;}这样元素1可以回到正常位置并与其他元素对齐。2.overflow:hidden使用overflow:hidden还可以使内联块元素的基线变得相同注解在查阅资料时发现使用display:inline-block经常会导致元素之间出现空格。这样做的原因是元素之间使用了空格、回车等元素，所以会被识别，所以会有空格间隔。我们可以在父容器中设置font-size:0来隐藏这些空格或者可以查看这篇文章来解决空格问题https://www.zhangxinxu.com/wo...
