小程序商品 微信小程序商品介绍

page{

    background-color: #ffffff;

    font-family: "Helvetica Neue","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53",Arial,sans-serif;

    font-size: 30rpx;

color:#888;

}

.navigator-hover{

    background: none;

}

.goods-box{

    position: relative;

    text-align: center;

    color: #454552;

    border-bottom: 30rpx solid #ededed;

}

.goods-box .goods-thumb{

    width: 100%;

    height: 390rpx;

}

.goods-box .goods-operation{

    position: relative;

    width: 92%;

    height: 100rpx;

    line-height: 100rpx;

    padding: 0 50rpx;

    margin:0 auto 60rpx;

    box-sizing: border-box;

    border-radius: 10rpx;

    background: #39F50B;

    color: #fff;

    font-size: 28rpx;

}

.goods-operation text{

    display: inline-block;

    height: 100rpx;

}

.goods-operation-num{

    width: 160rpx;

}

.goods-operation-add{

    width: 80rpx;

    margin-right: 30rpx;

}

.goods-to-cart{

    width: 210rpx;

    padding-right: 75rpx;

}

.goods-cart-img{

    position: absolute;

    right: 50rpx;

    top: 28rpx;

    width: 45rpx;

    height: 45rpx;

}

.goods-left{

float:left;

    font-size: 28rpx;

    margin-bottom: 20rpx;

}

.goods-right{

float:right;

    font-size: 28rpx;

    margin-bottom: 20rpx;

}

.gooddetail{

width:92%;

margin:0 auto 

}

.goods-title{

width:92%;

border-bottom:1px solid #eee;

line-height:80rpx;

    font-size: 36rpx;

    margin:0 auto 30rpx;

}

.goods-price-left{

    font-size: 32rpx;

float:left;

}

.goods-price-right{

    font-size: 40rpx;

float:right;

color:red;

font-weight:bold;

}

.goods-tab-nav{

    display: inline-block;

    width: 33.33%;

    height: 90rpx;

    line-height: 90rpx;

    border-bottom: 1rpx solid #ededed;

    box-sizing: border-box;

    text-align: center;

    color: #c7c7cb;

}

.goods-tab-nav.on{

    color: #bcaa8a;

    border-bottom: 5rpx solid #bcaa8a;

}

.goods-content{

    padding: 40rpx;

}

.goods_details{

display: inline-block;

    width: 100%;

    height: 90rpx;

    line-height: 90rpx;

    border-bottom: 1rpx solid #ededed;

    box-sizing: border-box;

    text-align: center;

    color: #c7c7cb;

}

.ubom{clear:both;width:92%;height:20rpx;border-bottom:1px solid #eee;margin:20rpx auto;}

<view class="main">

    <view class="goods-box">

        <image src="/image/uuu1.jpg" class="goods-thumb" mode="aspectFill"></image>

        <view class="goods-title">微信小程序</view>

<view class="gooddetail">

  <view class="goods-left">库存：89</view>

</view>

<view style="clear:both;"></view>

<view class="gooddetail" style="margin-bottom:15rpx;">

  <view class="goods-price-left">原价：￥1000</view>

  <view class="goods-price-right">现价：￥99</view>

</view>

<view class="ubom"></view>

    <view class="goods-operation" bindtap="teltoUs">

            <text >拨打电话</text>

        </view>

    </view>

    <view class="goods-tab-box">

        <view class="goods_details" data-index="0">商品详情</view>

        <view class="goods-content">

            <view>微信小程序商品介绍、微信小程序商品介绍、微信小程序商品介绍、微信小程序商品介绍、微信小程序商品介绍、</view>

        </view>

    </view>

</view>