flex实现标题，标题两边有横向横线效果

作者：Jasmine - 2020年06月12日

分成三列布局去实现

<view class="common-title">
    <view class="title-left">---</view>
    <view class="title-center">猜你喜欢</view>
    <view class="title-right">---</view>
</view>

.common-title{display: flex;background-color: #FF3333;
color: #fff;margin-bottom: 20rpx;}
.title-left{flex-grow: 1;display: flex;justify-content: flex-end;}
.title-center{width: 160rpx;text-align: center;}
.title-right{flex-grow: 1;}

效果图：

本文作者： Jasmine

本文链接： https://www.jianbaizhan.com/article/658

版权声明：本博客所有文章除特别声明外，均采用 CC BY-NC-SA 3.0 许可协议。转载请注明出处！