凸边框顶部和边框底部与CSS？

Question

我试图只为顶部和边框设置一个边框，中间有一条粗线（4px），端部变为零。就像在pic中一样

.hervorheben{
    line-height: 1.6em;
    margin-bottom: 1.6em;
    margin-top: 1.6em;
    text-rendering: optimizeLegibility;
    border-top: 1px solid #105322;
    border-bottom: 1px solid #105322;
    padding: 19px;
    margin: auto auto;
}

你知道如何只用css吗？

Answer 1

你不能像这样制作边框，但你可以使用Pseudo-element（之后）管理，如下所示

.your_class {
    position: relative
}

.your_class:after {
    position: absolute;
    width: 100%;
    height: 4px;
    background: #000;
    border-radius: 100%;
    content: "";
    top: 0;
    left: 0;
}

享受....