之前一直以为要使元素b在元素a里面垂直居中，只需要设置元素b:vertical:middle以及display:inline-block,就行了。但是实时是很多时候。都没变化。 这是因为虽然让元素b设置了属性vertiacl:middle,但是元素b并没有参照物 ...

以前总是以为vertical-align与text-align是同样的道理，一个是垂直居中，一个是水平居中，结果在这里一点效果也没有。事实上vertical-align与text-align完全不一样，vertical-align不能这样用。 vertical-align 属性设置元素 ...

: 2.1rem; vertical-align:middle; } header .logo img ...

前言 总所周知，“css如何实现元素垂直居中？”已经是一个老生常谈的问题了，这个问题目前已经有了许多解决方案，这些方案也都有各自适用的场景以及优缺点，大致如下： flex布局 grid布局 table布局 line-height搭配height position搭配 ...

　　使用vertical-align:middle可以让行级元素垂直居中，但这个居中是以文字的中线来计算的，而文字的中线在不同的字体上不同，甚至相同的字体在不同的浏览器上显示的都不同。 　　所以直接使用vertical-align:middle很难完美居中，因此需要其它调整 ...

： 我们只给图片设置vertical-align:middle 是不起作用的 ，是因为这句话是：将支持val ...

这样是不能居中显示的，打开注释的代码即可 ...

对于行内块（比如说图片）元素如果设置了text-align 和line-height 出现了不居中的情况下，因为图片和文字是基线对齐的。 如下图所示： 解决方案：我们需要设置图片的vertical-align属性，将这个属性设置为vertical-align:middle ...