1. 程式人生 > >小程式中間有字的分隔線

小程式中間有字的分隔線

程式碼如下:


wxml

<view class="line">
  <span>到底啦,我是有底線的</span>
</view>


wxss

/* 分隔線--底部 */
.line{
    width: 90%;    /* 分隔線的長度 */
    margin: auto;
    height: 1px;    /* 分隔線粗細 */
    text-align: center;
    font-size: 24rpx;
    color: #aaa;
    background: #ccc;
}
.line span{
    position: relative;
    top: -8px;
    background: #fff;
    padding: 10px 10px;
}