91 lines
1.9 KiB
Vue
91 lines
1.9 KiB
Vue
<template>
|
|
<view class="choosesizeCardesc">
|
|
<view class="desc">
|
|
<view class="problem">
|
|
<view class="desc1">
|
|
<view class="icon">问</view>
|
|
<text class="zi">{{problem}}</text>
|
|
</view>
|
|
<view class="desc1 answer">
|
|
<view class="icon icon1">答</view>
|
|
<text class="zi">{{answer}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="line"></view>
|
|
<img :src="shoppic" alt class="shop" />
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name:'choosesizeCardesc',
|
|
props:{
|
|
problem:{
|
|
type:String
|
|
},
|
|
answer:{
|
|
type:String
|
|
},
|
|
shoppic:{
|
|
type:String
|
|
}
|
|
}
|
|
};
|
|
// problem 问题 answer 答案 shoppic 商品图片
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.choosesizeCardesc {
|
|
width: 706upx;
|
|
height: 787upx;
|
|
background-color: white;
|
|
.desc {
|
|
width: 659upx;
|
|
height: 112upx;
|
|
margin: 0 auto;
|
|
.problem {
|
|
padding-top: 41upx;
|
|
.desc1 {
|
|
height: 29upx;
|
|
display: flex;
|
|
line-height: 29upx;
|
|
.icon {
|
|
width: 29upx;
|
|
height: 29upx;
|
|
background-color: #c7513f;
|
|
color: white;
|
|
font-size: 21upx;
|
|
text-align: center;
|
|
}
|
|
.zi {
|
|
color: #5c5c5c;
|
|
font-size: 24upx;
|
|
margin-left: 9upx;
|
|
}
|
|
.icon1 {
|
|
background-color: #4bb20c;
|
|
}
|
|
}
|
|
}
|
|
|
|
.answer {
|
|
margin-top: 24upx;
|
|
margin-bottom: 32upx;
|
|
}
|
|
.line {
|
|
width: 657upx;
|
|
height: 1upx;
|
|
background-color: #dadada;
|
|
margin-bottom: 16upx;
|
|
}
|
|
.shop {
|
|
width: 632upx;
|
|
height: 562upx;
|
|
margin: 0 auto;
|
|
margin-bottom: 23upx;
|
|
}
|
|
}
|
|
}
|
|
</style> |