Html 垂直对齐：中间未按预期工作

垂直对齐：中间

未按预期工作

上面的链接说：

元素放置在父元素

的中间

但是，在下面的链接中，<代码>“Word”<代码>没有放置在父元素的中间。

。你好{
字体大小：32px；
背景色：热粉红色；
}
.世界{
字体大小：20px；
背景色：石灰；
垂直对齐：中间对齐；
}

---

Hello world

所以您需要在

span

内部安装

span

。上面说,

元素放置在父元素

的中间 因此，它必须位于父元素内部，在本例中，我理解为

span

。除非您将

p

视为父项，否则在这种情况下，您可以将

class=“hello”

移动到

p

标记

p{
背景颜色：橙色；
}
.你好{
字体大小：32px；
背景色：热粉红色；
}
.世界{
字体大小：20px；
背景色：石灰；
垂直对齐：中间对齐；
显示：表格单元格；
}

你好，世界

试试下面的代码

.你好{
字体大小：32px；
背景色：热粉红色；
}
跨度{
字体大小：20px；
背景色：石灰；
垂直对齐：中间对齐；
}
你好，世界

您的第一个跨度比其他跨度大。因此，p标签的大小会随着跨度的增大而变化。因此，我必须在两个跨度上应用“真实对齐：中间”

 .hello {
   font-size: 32px;
   background-color: hotpink;
 }

p span {
  font-size: 20px;
  background-color: lime;
  vertical-align: middle;
}

---

因为它必须是中心。如果有一个父元素，可以将子元素中心设置为它的父元素，希望在中间对齐文本，这样就不起作用了。W3Script页面上的文本很短，以致误导。要是他们多花几句话解释就好了。“Play it”示例也没有太大帮助。我很好奇为什么

“world”

不以

标记为中心以使其居中。当您在世界级上添加垂直对齐css时。它如何理解哪一个是中间点。为其父标记赋予一定的高度。