我正在尝试在专栏的顶部边框之间创建徽标。
我也试图创建轮廓边框，但是它需要像外部边框一样的边框半径。
这是我目前的代码：
.border-it {
background: #FFF;
float: left;
border: 0px solid #FFF;
border-radius: 10px;
outline: 2px solid #F3B802;
outline-offset: -20px;
padding: 30px;
text-align: center;}<div class="container">
<div class="row">
<div class="col-4">
<div class="col-12 border-it">
<h1>test1</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid at iusto neque nisi non optio quisquam similique? Animi blanditiis culpa deleniti distinctio eveniet expedita iusto modi nihil nulla quidem quod, saepe sit tempora, voluptatem voluptatum. Autem delectus dolores, ducimus error eum hic incidunt necessitatibus odio quam quasi quos reiciendis voluptatem!</p>
</div>
</div>
<div class="col-4">
<div class="col-12 border-it">
<h1>test2</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid at iusto neque nisi non optio quisquam similique? Animi blanditiis culpa deleniti distinctio eveniet expedita iusto modi nihil nulla quidem quod, saepe sit tempora, voluptatem voluptatum. Autem delectus dolores, ducimus error eum hic incidunt necessitatibus odio quam quasi quos reiciendis voluptatem!</p>
</div>
</div>
<div class="col-4">
<div class="col-12 border-it">
<h1>test3</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid at iusto neque nisi non optio quisquam similique? Animi blanditiis culpa deleniti distinctio eveniet expedita iusto modi nihil nulla quidem quod, saepe sit tempora, voluptatem voluptatum. Autem delectus dolores, ducimus error eum hic incidunt necessitatibus odio quam quasi quos reiciendis voluptatem!</p>
</div>
</div>
</div>
我在这里有一个屏幕快照，显示了它现在的外观和外观：
