html - 如何在html中的文本顶部放置一行？

Question

所以我想尝试在 html 和 css 中执行此操作，但我似乎找不到任何东西。我唯一能想到的方法是将文本作为图像导入，但这看起来很糟糕。 P.S 浅蓝色线用于居中，因为我首先在 Photoshop 中设计网站

<p class="test">
Conact Me
</p>

.test {
border-top-style: solid;
border-bottom-style: solid;
border-bottom-width: 1px;
}

Answer 1

一个简单的解决方案是使用text-decoration: underline overline;。

p {
  text-decoration: overline underline;
}

<p>
CONTACT ME
</p>