要实现HTML中字体的垂直显示，可以通过CSS的writing-mode属性来控制。writing-mode属性定义了文本的排列方向，例如水平或垂直，在CSS3中，支持多种不同的文本排列方式，这使得我们可以轻松地将文本从横向排列转换为纵向排列。
我们需要了解writing-mode属性的两个基本值：horizontal-tb和vertical-tb。horizontal-tb表示文本从左到右水平排列（这是大多数语言的默认排列方式），而vertical-tb表示文本从上到下垂直排列。
为了使HTML中的字体垂直显示，我们可以在CSS中设置writing-mode属性为vertical-tb，下面是一个简单的示例，展示了如何将一个段落的文本设置为垂直显示：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>垂直字体示例</title>
<style>
.vertical-text {
writing-mode: vertical-tb;
/* 其他样式属性，如字体大小、颜色等 */
font-size: 16px;
color: #333;
}
</style>
</head>
<body>
<p class="vertical-text">这段文字将会垂直显示。</p>
</body>
</html>
在上面的代码中，我们创建了一个名为.vertical-text的CSS类，并将writing-mode属性设置为vertical-tb，我们将这个类应用到一个<p>标签上，使得该段落的文本垂直显示。
需要注意的是，垂直显示的文本可能会受到字体的支持程度影响，某些字体可能不支持垂直排列，或者在垂直排列时显示效果不佳，为了确保垂直文本的显示效果，建议使用专门为垂直排列设计或支持的字体。
垂直文本的布局可能需要额外的CSS调整，垂直文本的行间距、段落间距、对齐方式等可能需要根据实际情况进行调整，为了更好地控制垂直文本的布局，可以使用其他CSS属性，如line-height、letter-spacing、text-align等。
在实际应用中，垂直文本可能会用于特定的设计目的，例如创建具有传统东方风格的页面布局，垂直文本可能会影响用户的阅读体验，因为大多数人习惯于水平阅读文本，在决定使用垂直文本时，应充分考虑目标受众和使用场景。
通过CSS的writing-mode属性，我们可以轻松地实现HTML中字体的垂直显示，在实际开发中，可能还需要根据具体需求调整其他CSS属性，以达到最佳的视觉效果和用户体验。