我们可以在css中的标题周围添加边框吗

Question

标题周围的边框，带上开

如何使用CSS 在标题周围进行这种类型的边框

我在Elementor中尝试过，但无法做到这一点。我试图给它所有的边框，然后通过给字幕白色背景，我试图给负边距。我们可以使用CSS 尝试吗

Answer 1

你可以用绝对位置来做这件事，这里是我想出的一个例子：

.title{
position: relative;
border: 2px solid black;
border-radius: 10px;
width: 100px;
text-align: center;
}
.title span{
position: absolute;
top: -27%;
left: 50%;
transform: translate(-50%);
background-color: #fff;
width: 50px;
}

<div class="title">
<span> We are </span> <br>
our services
</div>