代码拉取完成,页面将自动刷新
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1, maximum-scale=1, user-scalable=no" />
<title>商品详情</title>
</head>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding-bottom: 129px;
}
.itemContent {
display: flex;
justify-content: center;
}
.actImg {
width: 355px;
height: 290px;
}
.goodsTitle {
margin-left: 20px;
margin-right: 20px;
margin-top: 10px;
}
.cashier_price {
margin-top: 10px;
color: red;
margin-bottom: 10px;
font-size: 20px;
}
.cashier_priceNumber {
font-size: 30px;
font-weight: 400;
margin-left: 4px;
}
.dliver {
width: 100%;
height: 10px;
background-color: #ECF1F4;
}
.orderContent {
width: 100%;
display: flex;
flex-direction: row;
margin-top: 15px;
}
.orderLeft {
margin-left: 20px;
margin-right: 25px;
color: #818489;
}
.detail {
margin-left: 20px;
margin-right: 20px;
margin-top: 15px;
margin-bottom: 15px;
font-size: 14px;
}
.logo {
height: 100px;
width: 100px;
margin-top: 100px;
margin-left: auto;
margin-right: auto;
margin-bottom: 25px;
}
.text-area {
display: flex;
justify-content: center;
}
.title {
font-size: 18px;
color: #8f8f94;
}
.btnView {
width: 80%;
margin-top: 30px;
height: 33px;
display: flex;
line-height: 33px;
color: #366092;
justify-content: center;
border: #1296db solid 1px;
border-radius: 10px;
}
.cashier_footer {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 10;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
padding-bottom: 5px;
background-color: white;
/* cursor: pointer; */
}
.cashier_payBtn {
width: 343px;
height: 44px;
background: rgb(133, 133, 133);
border-radius: 4px;
color: rgba(255, 255, 255, 0.85);
line-height: 44px;
margin-bottom: 20px;
font-size: 16px;
cursor: pointer;
}
</style>
<body>
<script language="javascript" type="text/javascript">
function gotoOrder() {
window.location.href = "orderConfirm.html";
}
</script>
<div class="content">
<swiper style="height: 300px;display: flex;align-items: center;justify-content: center;">
<block>
<swiper-item class="itemContent"><img class="actImg" mode="aspectFill"
src="./img/mouse.png"></img>
</swiper-item>
</block>
</swiper>
<div class="goodsTitle">无线鼠标静音无声笔记本台式电脑游戏</div>
<div class="cashier_price">
<span>¥</span>
<span class="cashier_priceNumber">0.01</span>
</div>
<div class="dliver"></div>
<div class="orderContent">
<div class="orderLeft">已选</div>
<div>银色</div>
</div>
<div class="orderContent" style="margin-bottom: 15px;">
<div class="orderLeft">送至</div>
<div>上海 嘉定区</div>
</div>
<div class="dliver"></div>
<div class="detail">
按键采用竞技游戏级别的微动开发,零延迟,回弹利索,提高工作效能。<br />
高品质静音按键,轻松使用不扰人。
</div>
<div class="cashier_footer">
<div class="dliver"
style="text-align: center;height:45px ;font-size: 13px;color: #F5A478;align-items: center;display: flex;justify-content: center;margin-bottom: 15px;">
本页面只用于演示收银台支付,不发货、不退款
</div>
<div class="cashier_payBtn" style="background: #FEAD0B" onclick="gotoOrder()">
立即购买
</div>
</div>
</div>
</body>
</html>
<script src="https://cdn.cloudpnr.com/opps/libs/jquery/jquery-2.1.2.min.js"></script>
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。