在HTML中，要实现上下居中，可以使用CSS样式，以下是一个简单的示例：
<!DOCTYPE html>
<html>
<head>
<style>
.center {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
</style>
</head>
<body>
<div class="center">
<p>这个段落将会上下居中显示。</p>
</div>
</body>
</html>
在这个示例中，我们创建了一个名为.center的CSS类，该类使用Flexbox布局来实现上下居中。display: flex;将元素设置为弹性容器，justify-content: center;和align-items: center;分别设置水平和垂直居中。height: 100vh;使容器占据整个视口的高度。
接下来，我们在HTML文档的<body>部分添加了一个<div>元素，并为其分配了.center类，这样，该<div>内的内容（在本例中是一个段落）就会上下居中显示。
需要注意的是，这个示例中的上下居中是相对于其父元素（即视口）进行的，如果你想要在另一个上下文中实现上下居中，可能需要调整CSS样式，如果你想要在一个固定高度的容器中实现上下居中，可以将height: 100vh;替换为一个具体的像素值或百分比值。