收货地址下边的平行四边形彩色线条

子钦加油

于 2020-07-29 00:29:00 发布

阅读量297

点赞数

服务器拼团：点我去阿里云购买

本文链接：https://blog.csdn.net/weixin_37557729/article/details/107652406

版权

以小程序为例

<view class="xiantiao">
    <view class="city"></view>
    <view class="city"></view>
    <view class="city"></view>
    <view class="city"></view>
    <view class="city"></view>
    <view class="city"></view>
    <view class="city"></view>
    <view class="city" style="margin-right:0px;"></view>
</view>

.city:nth-child(odd) {
    width:60rpx;
    height:10rpx;
    margin-right: 23px;
    background-color: #0076FF;
    color: #333;
    transform: skew(-45deg);
    float:left;
}
.city:nth-child(even) {
    width:60rpx;
    height:10rpx;
    margin-right: 23px;
    background-color: #FF9E57;
    color: #333;
    transform: skew(-45deg);
    float:left;
}

效果图