|
|
|
<!doctype html>
|
|
|
|
<html>
|
|
|
|
<head>
|
|
|
|
<style>
|
|
|
|
#main{
|
|
|
|
width:1550px;
|
|
|
|
height:600px;
|
|
|
|
MARGIN-RIGHT: auto;
|
|
|
|
MARGIN-LEFT: auto;
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div id="main">
|
|
|
|
<h1 style="position: relative;left: 280px;">订单ing</h1>
|
|
|
|
<div style=" background-color:#eeeeee; position:relative;left: 230px; height:1px; width:1000px;"></div>
|
|
|
|
<div style="background-color:#F0F8FF;position: relative;left:230px;transform: translateY(-10px);height: 30px;width: 1000px;">
|
|
|
|
<p style="transform: translateX(50px);">当前订单</p>
|
|
|
|
</div>
|
|
|
|
<div style="background-color:#b0c4de;position: relative;left:230px;transform: translateY(-10px);height: 30px;width: 1000px;">
|
|
|
|
<p style="transform: translateX(50px);">订单时间:</p>
|
|
|
|
</div>
|
|
|
|
<div style="background-color:#F0F8FF;position: relative;left:231px;transform: translateY(-25px);height: 30px;width: 200px;">
|
|
|
|
<p style="transform: translateX(70px);">球类</p>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div style="background-color:#F0F8FF;position: relative;left:432px;transform: translateY(-71px);height: 30px;width: 200px;">
|
|
|
|
<p style="transform: translateX(70px);">约球时间</p>
|
|
|
|
</div>
|
|
|
|
<div style="background-color:#F0F8FF;position: relative;left:633px;transform: translateY(-117px);height: 30px;width: 200px;">
|
|
|
|
<p style="transform: translateX(70px);">约球地点</p>
|
|
|
|
</div>
|
|
|
|
<div style="background-color:#F0F8FF;position: relative;left:834px;transform: translateY(-163px);height: 30px;width: 397px;">
|
|
|
|
<p style="transform: translateX(145px);">当前人数</p>
|
|
|
|
</div>
|
|
|
|
<div style="background-color:white;position: relative;left:231px;transform: translateY(-163px);height: 150px;width: 200px;">
|
|
|
|
</div>
|
|
|
|
<div style="background-color:#white;position: relative;left:432px;transform: translateY(-312px);height: 150px;width: 200px;">
|
|
|
|
</div>
|
|
|
|
<div style="background-color:white;position: relative;left:632px;transform: translateY(-462px);height: 150px;width: 200px;">
|
|
|
|
</div>
|
|
|
|
<div style="background-color:white;position: relative;left:833px;transform: translateY(-612px);height: 150px;width: 397px;">
|
|
|
|
</div>
|
|
|
|
<div style="background-color:#b0c4de;position: relative;left:230px;transform: translateY(-612px);height: 30px;width: 1000px;">
|
|
|
|
</div>
|
|
|
|
<div style=" background-color:#D3D3D3; position:relative;left: 230px; height:1px; width:1000px;transform: translateY(-792px);"></div>
|
|
|
|
<div style=" background-color:#D3D3D3; position:relative;left: 230px; height:1px; width:1000px;transform: translateY(-645px);"></div>
|
|
|
|
<div style=" background-color:#D3D3D3; position:relative;left: 230px; height:150px; width:1px;transform: translateY(-795px);"></div>
|
|
|
|
<div style=" background-color:#D3D3D3; position:relative;left: 430px; height:150px; width:1px;transform: translateY(-945px);"></div>
|
|
|
|
<div style=" background-color:#D3D3D3; position:relative;left: 630px; height:150px; width:1px;transform: translateY(-1093px);"></div>
|
|
|
|
<div style=" background-color:#D3D3D3; position:relative;left: 830px; height:150px; width:1px;transform: translateY(-1243px);"></div>
|
|
|
|
<div style=" background-color:#D3D3D3; position:relative;left: 1230px; height:150px; width:1px;transform: translateY(-1395px);"></div>
|
|
|
|
<p style="transform: translateY(-1620px);position: relative;left:400px;">待添加</p>
|
|
|
|
<p style="transform: translateY(-1540px);position: relative;left:300px;">待添加</p>
|
|
|
|
<p style="transform: translateY(-1580px);position: relative;left:500px;">待添加</p>
|
|
|
|
<p style="transform: translateY(-1620px);position: relative;left:700px;">待添加</p>
|
|
|
|
<p style="transform: translateY(-1660px);position: relative;left:1000px;">待添加</p>
|
|
|
|
<button type="button" onClick="alert('取消成功!')" style="position: relative;left:670px;transform: translateY(-1500px);">取消订单</button>
|
|
|
|
</div>
|
|
|
|
</body>
|
|
|
|
|
|
|
|
</html>
|