CSS-垂直对齐不起作用

我得到了一些真正的基本HTML&CSS:

以下是HTML:

<!DOCTYPE html>
<html>
<头>
<meta charset=“UTF-8”大于;
<link rel=“stylesheet”media=“all”href=”https://stackoverflow.com/questions/5442226/stylesheet.css“>
<标题>你好,世界&lt/标题>
&lt/头>
<车身>
<标题>
你好<sup>世界&lt/sup>
&lt/标题>
&lt/车身>
&lt/html>

以下是CSS:

标题{
垂直对齐:中间对齐;
高度:60px;
背景色:#00F;
}

但是文本没有在中间对齐。为什么不呢

垂直对齐属性仅适用于:

内联级别和“表格单元格”元素

请参阅此链接

您可以使用行高垂直居中文本,只需使其大于实际的字体大小,但仅当文本跨越一行时才有效

或者,您可以将填充以相等的值添加到标题元素的顶部和底部

根据注释编辑:如果使用HTML5标题元素,最明显的解决方案是使其显示:表格单元格而不是我认为重置CSS适用的默认块

发表评论