jiaqingjiayi-xiaochengxu/甲情_甲意/miniprogram/pages/shangpinjiemian/shangpinjiemian.acss
2024-11-15 11:51:28 +08:00

215 lines
3.0 KiB
Plaintext

/* 商品图背景 */
.image{
width: 390px;
height: 300px;
}
/* 价格 */
.box1{
width: 390px;
height: 80px;
background-color: #eec2c7;
position: relative;
top:0rpx;
border-radius: 15px;
}
.z1{
top: 20rpx;
left: 20rpx;
position: relative;
}
.z2{
top: 80rpx;
right: 140rpx;
position: relative;
font-weight: bolder;
font-size: 20px;
}
/* 商品底部 */
/* 商品价格 */
.z3{
font-size: 22px;
font-weight: bolder;
position: relative;
top:25rpx;
right: 60rpx;
}
.z4{
position: relative;
color: rgb(29, 18, 18);
}
.box8{
width: 400rpx;
position: relative;
left: 240rpx;
top: 25rpx;
}
/* 商品介绍 */
.z5{
font-size: 15px;
position: relative;
top:20rpx;
color: darkgrey;
left: 5px;
}
/* 中间信息 */
.z6{
font-size: 22px;
color: rgb(190, 57, 57);
position: absolute;
top:140px;
left: 10px;
}
.z7{
font-size: 22px;
position: absolute;
top:140px;
left: 130px;
}
.z8{
font-size: 22px;
position: absolute;
top:140px;
left: 250px;
}
/* 详情介绍 */
.box3{
width: 50px;
height: 2px;
position: absolute;
top:174px;
left: 32px;
background-color: rgb(169, 169, 169);
}
.Box3{
width: 390px;
height: 220px;
background-color: rgba(169, 169, 169, 0.53);
position: absolute;
top:180px;
border-radius: 20px;
}
.Box4{
width: 388px;
height: 218px;
background-color: #ffffff;
position: absolute;
top:1px;
left: 1px;
border-radius: 20px;
}
/* 内部盒子 */
.Box5{
width: 340px;
height: 130px;
background-color:rgba(169, 169, 169, 0.53) ;
position: absolute;
top:70px;
left: 30px;
border-radius: 10px;
}
.box6{
width:338px ;
height: 128px;
background-color: #ffffff;
position: absolute;
top:1px;
left: 1px;
border-radius: 10px;
}
.box7{
width: 338px;
height: 30px;
background-color:#FEFA83;
position: absolute;
}
.w4{
position: absolute;
top:5px;
left: 5px;
}
.w5{
position: absolute;
top:5px;
left: 240px;
}
.w6{
font-size: 13px;
position: absolute;
top:35px;
left: 5px;
}
.w7{
font-size: 13px;
position: absolute;
top:60px;
left: 5px;
}
.w8{
font-size: 13px;
position: absolute;
top:85px;
left: 5px;
}
.w9{
font-size: 13px;
position: absolute;
top:85px;
left: 60px;
}
.w10{
font-size: 13px;
position: absolute;
top:110px;
left: 5px;
}
.box9{
position: relative;
top: 35rpx;
}
.container {
padding: 16px;
}
.box10{
display: block;
margin-top: 15rpx;
}
.box11{
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
/* Add this in your style section */
.button-container {
display: flex;
justify-content: space-between;
padding: 10px;
position: absolute;
top: 700px;
left: 28px;
}
.button {
background-color: #f3bfc1; /* Light pink background color */
color: #000000; /* Text color */
border-radius: 20px; /* Rounded edges */
padding: 10px 20px;
text-align: center;
font-size: 16px;
width: 100px;
}
/* Additional styling for individual buttons if needed */
.add-to-cart {
margin-right: 20px;
}
.buy-now {
margin-left: 20px;
}