中间文字，两边横线

最新推荐文章于 2022-04-19 14:59:48 发布

sjxxl

最新推荐文章于 2022-04-19 14:59:48 发布

阅读量719

点赞数

分类专栏： css 文章标签： html css

本文链接：https://blog.csdn.net/sjxxl/article/details/78079965

版权

css 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

一、html

    <div class="status">
        <div class="status-txt">版型制作</div>
        <div class="status-leftLine"></div>
        <div class="status-rightLine"></div>
    </div>

二、css

   .status{
    position: relative;
    text-align: center;
    margin-top: 0.72rem;
    margin-bottom: 0.48rem;
}
.status-leftLine{
    position: absolute;
    left: 1.7rem;
    width: 1.333333rem;
    height: 1px;
    background-color: #ccc;
    margin: auto;
    top: 0;
    bottom: 0;
}
.status-rightLine{
    position: absolute;
    right: 1.7rem;
    width: 1.333333rem;
    height: 1px;
    background-color: #ccc;
    margin: auto;
    top: 0;
    bottom: 0;
}