这种样子的边框wxss如何写

发布于 8 年前作者 zengping4679 次浏览最后编辑 8 年前来自 ask

图中红圈部分的wxss 应该怎么写能出现这种中间隔断的样式呢,将时间放在中央,用border吗?求指教,谢谢!!

3 回复
xiuyinghuang
xiuyinghuang1 楼6 年前

用2个单独的view设宽高背景颜色 画成横线就好啦  和时间在一起 3个横排

ming52
ming522 楼6 年前

大概这样子吧

<view class=‘date’>2019-4-8</view>

.date{

display:table;

width: 90%;

line-height: 32rpx;

margin: 20rpx auto;

background-color: #fff;

white-space: nowrap;

border-spacing: 20rpx 0;

}

.date:before,

.date:after{

display: table-cell;

content: ‘’;

width: 50%;

background: linear-gradient(rgb(81, 255, 0),rgb(34, 235, 7)) repeat-x left center;

background-size: 1px 10rpx;

}

gangkang
gangkang3 楼6 年前

很多办法,个人觉得用伪元素最快