/* 店铺名框 */ .Box2 { width: 380px; height: 150px; background-color: white; position: relative; left:5px; top:50px; border-radius: 15px; } /* 店铺名 */ .z2{ font-size: 25px; font-weight: bolder; left: 50rpx; bottom: 130rpx; position: relative; } .image1{ width: 80px; height: 20px; position: relative; right: 230rpx; bottom: 50rpx; } .z3{ position: relative; color: rgb(194, 53, 53); bottom:95rpx; left: 230px; } .z4{ position: relative; left: 480rpx; bottom: 95rpx; } /* 相册框按钮 */ .box2{ width: 60px; height: 40px; position: relative; background-color: rgb(197, 190, 190); top:110px; left: 300px; border-radius: 10px; } .z5{ top:10px; left: 10px; position: absolute; } /* 营业时间 */ .z6{ color: #4095E5; font-weight: bolder; top:20px; left: 10px; position: relative; } .z7{ position: relative; top:38rpx; left: 30rpx; font-size: 13px; } .box3{ width: 390px; height: 1px; background-color: darkgrey; position: relative; top:50rpx; } /* 地址 */ .z8{ position: relative; font-size: 12px; top:60rpx; left: 35rpx; } .image3{ width: 10px; height: 12px; position: absolute; top:395rpx; left: 5px; } .box4{ width: 390px; height: 1px; background-color: darkgrey; position: relative; top:90rpx; } /* 推荐项目 */ .zt1{ font-size: 18px; top:130rpx; left: 10px; position: relative; } /* 第一个项目 */ .image2{ width: 185px; height: 140px; position: relative; top:0px; left: 0px; border-radius: 10px; } .zt2{ font-size: 20px; position: relative; top:10rpx; left: 30rpx; } .zt3{ color: #E89709; font-size: 19px; font-weight: bolder; position: relative; top:10rpx; left: 100rpx; } .zt4{ position: absolute; top:5px; left: 8px; color: #ffffff; } .zt5{ font-size: 20px; position: absolute; top:425px; right: 30px; } .zt6{ color: #E89709; font-size: 19px; font-weight: bolder; position: absolute; top:445px; right: 60px; } .h4{ width: 80px; height: 30px; position: absolute; background-color: #58A55C; top:470px; left: 298px; border-radius: 10px; } .zt7{ position: absolute; top:5px; right: 8px; color: #ffffff; } /* 推荐美甲师 */ .wz1{ font-size: 18px; position: absolute; top:505px; left: 10px; } /* 第一个美甲师 */ .h5 image{ width: 80px; height: 100px; position: absolute; top:530px; left: 20px; } .wz2{ position: absolute; top:635px; left:45px; } /* 咨询框 */ .h6{ width: 40px; height: 25px; position: absolute; background-color: #E89709; top:656px; left: 15px; border-radius: 10px; } .wz3{ top:3px; left: 4px; position: absolute; color: #ffffff; } /* 预约框 */ .h7{ width: 40px; height: 25px; position: absolute; background-color: #58A55C; top:656px; left: 60px; border-radius: 10px; } .wz4{ top:3px; left: 4px; position: absolute; color: #ffffff; } /* 第二个美甲师 */ .h8 image{ width: 80px; height: 100px; position: absolute; top:530px; left: 110px; } .wz5{ position: absolute; top:635px; left:135px; } /* 咨询框 */ .h9{ width: 40px; height: 25px; position: absolute; background-color: #E89709; top:656px; left: 110px; border-radius: 10px; } .wz6{ top:3px; left: 4px; position: absolute; color: #ffffff; } /* 预约框 */ .h10{ width: 40px; height: 25px; position: absolute; background-color: #58A55C; top:656px; left: 155px; border-radius: 10px; } .wz7{ top:3px; left: 4px; position: absolute; color: #ffffff; } /* 底部框 */ .Box6{ width: 390px; height: 80px; height: #ffffffe9; position: absolute; top:700px; } .Box6 image{ width: 35px; height: 30px; position: absolute; top:15px; left: 20px; } .box5{ width: 390px; height: 1px; background-color: darkgray; } .t1{ position: absolute; top:20px; left: 60px; } .box6{ width: 130px; height: 40px; background-color: #eec2c7; position: absolute; top:11px; left: 240px; border-radius: 20px; } .t2{ font-size: 20px; top:8px; left: 48px; position: absolute; } .image{ width: 200rpx; height: 200rpx; position: relative; left: 20rpx; border-radius: 10%; } .h1{ margin-left: 10rpx; display: flex; position: relative; top: 160rpx; }