收藏
回答

开发工具一样,结构样式一样,但是显示的不一样

问题模块 框架类型 问题类型 操作系统 工具版本
开发者工具 小程序 Bug Windows 1.02.1807200

 前端的 小程序打开的页面正常,

php的小程序打开页面布局乱了。




<view class="products-der">

    <view class="imgbox"><image  src="../../images/no-result.png" /></view>

    <view class="product-info" >

        <view class="name">示意文字示意文字示意文字示意文字示意文字示意文字示意文字示意文字示意文字示意文字示意文字示意文字示意文字示意文字示意文字示意文字</view>

        <view class="der">颜色:黑色 规格:M 数量:1</view>

        <view>

            <text class="price">¥5137</text>

            <text class="btn">申请退款</text>

        </view>

    </view>

</view>

.products-der{ display: flex; align-items: center; justify-content: space-between; padding: 30rpx 20rpx; border-bottom: 10rpx solid #f2f2f2; height: 180rpx;}

.products-der image{ width: 180rpx; height: 180rpx; object-fit: cover}

.products-der .product-info{flex: 1; overflow: hidden; padding-left: 20rpx;}

.products-der .product-info .name{ overflow : hidden;    text-overflow: ellipsis;    display: -webkit-box;    -webkit-line-clamp: 2;    -webkit-box-orient: vertical;font-size: 26rpx;color: #414141; line-height: 1.5;}

.products-der .product-info .der{font-size: 24rpx;color: #414141; white-space: nowrap ; overflow: hidden; text-overflow: ellipsis; margin: 6rpx 0; line-height: 1.5}

.products-der .product-info view:last-child{ display: flex; justify-content: space-between; align-content: center}

.products-der .product-info .price{ color: #d31723; font-size: 28rpx;}

.products-der .product-info .btn{ color: #e14232; border:2rpx solid #e14232;font-size: 22rpx; width: 140rpx; height: 50rpx; border-radius: 25rpx;text-align: center; line-height: 50rpx;}


最后一次编辑于  2018-07-25
回答关注问题邀请回答
收藏

1 个回答