为什么垂直对齐：中间在我的代码中不起作用，即使我将显示更改为内联块 xo 文本不应该位于该容器的垂直中间 什么时候才能真正发挥作用？
<!DOCTYPE html>
<html>
<style>
.container {
height: 100px;
background-color: pink;
}
.centered {
display: inline-block;
vertical-align: middle;
}
</style>
<body>
<div class="container">
<p class="centered">xo</p>
</div>
</body>
</html>
将.container类的display属性设置为inline-block或flex。这是您的更新代码：
.container {
height: 100px;
background-color: pink;
display: inline-block; or display: flex;
}