在文字两边加两道线

html的代码

<div class="wrapper">

    <div class="wrapper-content">
        <div class="line"></div>
        <div class="title">商品属性</div>
        <div class="line"></div>
     </div>

</div>

css代码：

<style type="text/css">
        .wrapper{width: 100%;}
        .wrapper-content{width:40%;display:flex;margin: 0 auto;}
        .line{flex: 1;position: relative;border-bottom: 1px solid rgba(0,0,0,0.2);
        top: -6px;}
        .title{line-height: 16px;font-size: 14px;font-weight:700; color:rgb(0,0,0);}


        </style>

运行效果：