修改个人中心、固定界面

master
CYB 6 years ago
parent 0c3c7ac7ce
commit 1dbd547656

@ -0,0 +1,20 @@
<!doctype html>
<html>
<head>
<style>
#header {
background-color:#87CEFA;
color:white;
text-align:left;
padding:5px;
}
</style>
</head>
<body>
<div id="header">
<h1>个人中心</h1>
</div>
</body>
</html>

@ -1,85 +1,15 @@
<!doctype html> <!doctype html>
<html> <html>
<frameset rows="14%,86%">
<frame src= "head.html">
<frameset cols="120,*">
<frame src="导航框架.html">
<frame src= "基本资料.html" name="show">
</frameset>
</frameset><noframes></noframes>
<head> <head>
<style>
#header {
background-color:black;
color:white;
text-align:left;
padding:5px;
}
.city {
float:left;
margin: 5px;
padding: 15px;
width: 300px;
height: 300px;
border: 1px solid black;
}
.section {
float: left;
margin: 5px;
padding: 15px;
width: 430px;
height: 680px;
border: 1px solid black;
}
.section1{
float: left;
margin: 5px;
padding: 15px;
width: 580px;
height: 335px;
border: 1px solid black;
transform: translateY(-380px);
}
.section2{
float: left;
margin: 5px;
padding: 15px;
width: 360px;
height: 335px;
border: 1px solid black;
transform: translateY(-380px);
position:relative;
right:0px
}
</style>
</head> </head>
<body>
<div id="header">
<h1>约球吧</h1>
<h2>个人中心</h2>
</div>
<div class="city">
<h2>基本资料</h2>
<p>用户名</p>
<p>性别</p>
<p>电子邮箱</p>
<p>手机号</p>
<br>
<p><a href ="修改资料界面.html" style="text-decoration: none">修改个人资料</a></p>
</div>
<div class="city">
<h2>个人简介</h2>
<p></p>
</div>
<div class="city">
<h2>历史订单</h2>
<p></p>
</div>
<div class="section" style="background: url( 图片/14_3.jpg) ">
<h2 style="color:black"></h2>
</div>
<div class="section1" style="background: url(图片/詹姆斯.jpg)">
</div>
<div class="section2" style="background: url( 图片/QQ截图20190107111832.png)">
</div>
<body>
</body> </body>
</html> </html>

@ -2,6 +2,13 @@
<html> <html>
<head> <head>
<style> <style>
#main{
width:1550px;
height:950px;
MARGIN-RIGHT: auto;
MARGIN-LEFT: auto;
}
#header { #header {
background-color:black; background-color:black;
color:white; color:white;
@ -21,6 +28,7 @@
</head> </head>
<body> <body>
<div id="main">
<div id ="header"> <div id ="header">
<h1>约球吧</h1> <h1>约球吧</h1>
</div> </div>
@ -214,5 +222,6 @@
</div> </div>
<button type="button" onClick="alert('提交成功!')" style="position: relative;left:500px;transform: translateY(-60px);">提交</button> <button type="button" onClick="alert('提交成功!')" style="position: relative;left:500px;transform: translateY(-60px);">提交</button>
</div> </div>
</div>
</body> </body>
</html> </html>

@ -0,0 +1,97 @@
<!doctype html>
<html>
<head>
<style>
#main{
width:1550px;
height:160px;
MARGIN-RIGHT: auto;
MARGIN-LEFT: auto;
}
#a{
position: absolute;
top: 120px;
right: 170px;
}
#b{
position: absolute;
top: 150px;
right: 170px;
}
#c{
position: absolute;
top: 180px;
right: 170px;
}
#d{
position: absolute;
top: 210px;
right: 170px;
}
#e{
position: absolute;
top: 240px;
right: 170px;
}
</style>
</head>
<body>
<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>
<table border="1">
<tr id="a">
<td style="width: 196px;height: 30px;"></td>
<td style="width: 196px;height: 30px;"></td>
<td style="width: 196px;height: 30px;"></td>
<td style="width: 392px;height: 30px;"></td>
</tr>
<tr id="b">
<td style="width: 196px;height: 30px;"></td>
<td style="width: 196px;height: 30px;"></td>
<td style="width: 196px;height: 30px;"></td>
<td style="width: 392px;height: 30px;"></td>
</tr>
<tr id="c">
<td style="width: 196px;height: 30px;"></td>
<td style="width: 196px;height: 30px;"></td>
<td style="width: 196px;height: 30px;"></td>
<td style="width: 392px;height: 30px;"></td>
</tr>
<tr id="d">
<td style="width: 196px;height: 30px;"></td>
<td style="width: 196px;height: 30px;"></td>
<td style="width: 196px;height: 30px;"></td>
<td style="width: 392px;height: 30px;"></td>
</tr>
<tr id="e">
<td style="width: 196px;height: 30px;"></td>
<td style="width: 196px;height: 30px;"></td>
<td style="width: 196px;height: 30px;"></td>
<td style="width: 392px;height: 30px;"></td>
</tr>
</table>
<div style="background-color:#b0c4de;position: relative;left:230px;transform: translateY(-13px);height: 30px;width: 1000px;">
</div>
</body>
</html>

@ -0,0 +1,88 @@
<!doctype html>
<html>
<head>
<style>
#section{
background-color: white;
color:black;
text-align:center;
margin:5px;
padding: 15px;
width:400px;
height: 600px;
}
</style>
</head>
<body>
<div id="section">
<h1 style="position: relative;left: 200px;">个人资料</h1>
<div style=" background-color:#DCDCDC; position:relative;left: 230px; height:1px; width:1000px;"></div>
<p style="position: relative;left: 200px;">用户名:</p>
<div style="background-color:#87CEFA;position: relative;left:240px; height: 30px;width: 200px;">
<p>基本资料</p>
</div>
<div style="background-color:#87CEEB;position: relative;left:441px;transform: translateY(-46px);height: 30px;width: 700px;">
<p></p>
</div>
<div style="background-color: #eeeeee;float: left;width:200px;height:600px;position:relative;left:240px;transform: translateY(-45px);"></div>
<div style="background-color:white;position: relative;left:441px;transform: translateY(-46px);height: 30px;width: 700px;">
<p style="position: relative;right: 400px;transform: translateY(-12px);">性别:
</p>
</div>
<div style="background-color:#eeeeee;position: relative;left:441px;transform: translateY(-80px);height: 30px;width: 700px;">
<p style="position: relative;right: 403px;transform: translateY(2px);">手机号:
</p>
</div>
<div style="background-color:white;position: relative;left:441px;transform: translateY(-46px);height: 30px;width: 700px;">
<p style="position: relative;right: 400px;transform: translateY(-47px);">电子邮箱:
</p>
</div>
<div style="background-color:#eeeeee;position: relative;left:441px;transform: translateY(-115px);height: 30px;width: 700px;">
<p style="position: relative;right: 400px;transform: translateY(2px);">生日:
</p>
</div>
<div style="background-color:white;position: relative;left:441px;transform: translateY(-132px);height: 30px;width: 700px;">
<p style="position: relative;left:-400px;transform: translateY(2px);">血型:
</p>
</div>
<div style="background-color:#87CEFA;position: relative;left:240px; height: 30px;width: 200px;transform: translateY(-150px);">
<p style="transform: translateY(-350px);">详细资料</p>
</div>
<div style="background-color:#87CEEB;position: relative;left:441px;transform: translateY(-195px);height: 30px;width: 700px;">
<p style="position: relative;left:-100px;"></p>
</div>
<div style="background-color:white;position: relative;left:441px;transform: translateY(-46px);height: 30px;width: 700px;">
<p style="position: relative;right: 390px;transform: translateY(-157px);">真实姓名:
</p>
</div>
<div style="background-color:#eeeeee;position: relative;left:441px;transform: translateY(-220px);height: 30px;width: 700px;">
<p style="position: relative;right: 395px;transform: translateY(2px);">职业:
</p>
</div>
<div style="background-color:white;position: relative;left:441px;transform: translateY(-240px);height: 30px;width: 700px;">
<p style="position: relative;right: 395px;transform: translateY(2px);">毕业院校:
</p>
</div>
<div style="background-color:#87CEFA;position: relative;left:240px; height: 30px;width: 200px;transform: translateY(-256px);">
<p style="transform: translateY(-120px);">丰富资料</p>
</div>
<div style="background-color:#87CEEB;position: relative;left:441px;transform: translateY(-302px);height: 30px;width: 700px;">
<p style="position: relative;left:-100px;">个人简介</p>
<textarea name="个人介绍" rows="20" cols="106" style="position: relative;left 0px; transform:translateY(-45px);"></textarea>
</div>
<p style="position: relative;top:-720px;left:780px;"><a href ="修改资料界面.html" style="text-decoration: none">修改个人资料</a></p>
</div>
</body>
</html>

@ -0,0 +1,12 @@
<!doctype html>
<html>
<head>
</head>
<body>
<p> <a href="基本资料.html" target="show" style="text-decoration: none">基本资料</a> </p>
<p> <a href="历史订单.html" target="show" style="text-decoration: none">历史订单</a> </p>
<div style=" background-color:#DCDCDC; position:relative;left: -5px;top: -45px; height:2px; width:223px;"></div>
<div style=" background-color:#DCDCDC; position:relative;left: -5px;top: -10px; height:2px; width:223px;"></div>
</body>
</html>

@ -1,10 +1,18 @@
<!doctype html> <!doctype html>
<html> <html>
<head> <head>
<style>
#main{
width:1550px;
height:600px;
MARGIN-RIGHT: auto;
MARGIN-LEFT: auto;
}
</style>
</head> </head>
<body> <body>
<div id="main">
<h1 style="position: relative;left: 280px;">订单ing</h1> <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:#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;"> <div style="background-color:#F0F8FF;position: relative;left:230px;transform: translateY(-10px);height: 30px;width: 1000px;">
@ -49,6 +57,7 @@
<p style="transform: translateY(-1620px);position: relative;left:700px;">待添加</p> <p style="transform: translateY(-1620px);position: relative;left:700px;">待添加</p>
<p style="transform: translateY(-1660px);position: relative;left:1000px;">待添加</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> <button type="button" onClick="alert('取消成功!')" style="position: relative;left:670px;transform: translateY(-1500px);">取消订单</button>
</div>
</body> </body>
</html> </html>

@ -3,13 +3,26 @@
<head> <head>
<style> <style>
a:link {color:#87CEFA;} a:link {color:#87CEFA;}
#main{
width:1550px;
height:800px;
MARGIN-RIGHT: auto;
MARGIN-LEFT: auto;
}
#city{
margin: 5px;
padding: 15px;
width: 1550px;
height: 750px;
border: 1px solid black;
}
#section{ #section{
width: 450px; width: 450px;
height: 600px; height: 600px;
padding: 10px; padding: 10px;
float: left; float: left;
background-color: white; background-color: white;
transform: translateY(50px); transform: translateY(-730px);
position: relative; position: relative;
left:540px; left:540px;
} }
@ -35,7 +48,7 @@
height: 50px; height: 50px;
background: #DC143C; background: #DC143C;
display: inline-block; display: inline-block;
transform: translateY(450px); transform: translateY(-370px);
position: relative; position: relative;
left:-223px; left:-223px;
} }
@ -43,21 +56,24 @@
</style> </style>
</head> </head>
<body style="background-image: url( 图片/QQ截图20190110093949.png);background-repeat:no-repeat"> <body style="overflow: hidden;">
<div id="main">
<div id="city" style="background-image:url(图片/QQ截图20190110093949.png);background-repeat: no-repeat;position: relative;left: -15px;top: -10px;"></div>
<div id="section"> <div id="section">
</div> </div>
<div id="section1" style="background:url(图片/QQ截图20190110095831.png);transform: translateY(80px);position: relative;right:610px;"></div> <div id="section1" style="background:url(图片/QQ截图20190110095831.png);transform: translateY(-710px);position: relative;right:640px;"></div>
<div id="name"> <div id="name">
<input style="transform: translateY(200px);position: relative;left: 115px; width: 350px;height:40px;" type="text" id="username" name="username" placeholder=" 请输入用户名" /> <input style="transform: translateY(-600px);position: relative;left: 115px; width: 350px;height:40px;" type="text" id="username" name="username" placeholder=" 请输入用户名" />
</div> </div>
<div id="name1"> <div id="name1">
<input style="transform: translateY(268px);position: relative;left: -265px; width: 350px;height:40px;" type="text" id="password" name="password" placeholder=" 请输入密码" /> <input style="transform: translateY(-540px);position: relative;left: -265px; width: 350px;height:40px;" type="text" id="password" name="password" placeholder=" 请输入密码" />
</div> </div>
<input style="transform: translateY(288px);position: relative;left: 134px; width: 350px;height:40px;" type="text" id="repassword" name="repassword" placeholder=" 确认密码" /> <input style="transform: translateY(-520px);position: relative;left: 134px; width: 350px;height:40px;" type="text" id="repassword" name="repassword" placeholder=" 确认密码" />
<input style="transform: translateY(356px);position: relative;left: -225px; width: 350px;height:40px;" type="text" id="phonenum" name="phonenum" placeholder=" 请输入手机号" /> <input style="transform: translateY(-460px);position: relative;left: -225px; width: 350px;height:40px;" type="text" id="phonenum" name="phonenum" placeholder=" 请输入手机号" />
<input style="transform: translateY(380px);position: relative;left: 134px; width: 350px;height:40px;" type="text" id="email" name="email" placeholder=" 请输入邮箱" /> <input style="transform: translateY(-440px);position: relative;left: 134px; width: 350px;height:40px;" type="text" id="email" name="email" placeholder=" 请输入邮箱" />
<input id="button" type="submit" value="注册"> <input id="button" type="submit" value="注册">
<a href="登录.html" style="text-decoration: none;position: relative;left:-350px;bottom: -520px">已有账号,立即登录</a> <a href="登录.html" style="text-decoration: none;position: relative;left:-350px;bottom: 260px">已有账号,立即登录</a>
</div>
</body> </body>
</html> </html>

@ -3,13 +3,26 @@
<head> <head>
<style> <style>
a:link {color:#87CEFA;} a:link {color:#87CEFA;}
#main{
width:1550px;
height:800px;
MARGIN-RIGHT: auto;
MARGIN-LEFT: auto;
}
#city{
margin: 5px;
padding: 15px;
width: 1550px;
height: 750px;
border: 1px solid black;
}
#section{ #section{
width: 450px; width: 450px;
height: 500px; height: 500px;
padding: 10px; padding: 10px;
float: left; float: left;
background-color: white; background-color: white;
transform: translateY(50px); transform: translateY(-730px);
position: relative; position: relative;
left:540px; left:540px;
} }
@ -35,7 +48,7 @@
height: 50px; height: 50px;
background: #DC143C; background: #DC143C;
display: inline-block; display: inline-block;
transform: translateY(350px); transform: translateY(-450px);
position: relative; position: relative;
left:130px; left:130px;
} }
@ -43,20 +56,23 @@
</style> </style>
</head> </head>
<body style="background-image: url( 图片/QQ截图20190110093949.png);background-repeat:no-repeat"> <body style="overflow: hidden;">
<div id="main">
<div id="city" style="background-image: url(图片/QQ截图20190110093949.png);background-repeat:no-repeat;position: relative;left: -15px;top: -10px;"></div>
<div id="section"> <div id="section">
</div> </div>
<div id="section1" style="background:url(图片/QQ截图20190110095831.png);transform: translateY(80px);position: relative;right:610px;"></div> <div id="section1" style="background:url(图片/QQ截图20190110095831.png);transform: translateY(-700px);position: relative;right:640px;"></div>
<div id="name"> <div id="name">
<input style="transform: translateY(200px);position: relative;left: 115px; width: 350px;height:40px;" type="text" id="username" name="username" placeholder=" 用户名/手机号/邮箱" /> <input style="transform: translateY(-600px);position: relative;left: 115px; width: 350px;height:40px;" type="text" id="username" name="username" placeholder=" 用户名/手机号/邮箱" />
</div> </div>
<div id="name1"> <div id="name1">
<input style="transform: translateY(268px);position: relative;left: -265px; width: 350px;height:40px;" type="text" id="password" name="password" placeholder=" 密码" /> <input style="transform: translateY(-520px);position: relative;left: -265px; width: 350px;height:40px;" type="text" id="password" name="password" placeholder=" 密码" />
</div> </div>
<div> <div>
<a href="注册.html" style="text-decoration: none;position: relative;left:330px;bottom: -300px;">没有账号,立即注册</a> <a href="注册.html" style="text-decoration: none;position: relative;left:330px;bottom: 500px;">没有账号,立即注册</a>
</div> </div>
<input id="button" type="submit" value="登录"> <input id="button" type="submit" value="登录">
</div>
</body> </body>
</html> </html>

@ -6,6 +6,12 @@
a:visited {color:#F0FFFF;} /* 已被访问的链接 */ a:visited {color:#F0FFFF;} /* 已被访问的链接 */
a:hover {color:#6495ED;} /* 鼠标指针移动到链接上 */ a:hover {color:#6495ED;} /* 鼠标指针移动到链接上 */
a:active {color:#E6E6FA;} /* 正在被点击的链接 */ a:active {color:#E6E6FA;} /* 正在被点击的链接 */
#main{
width:1500px;
height:1300px;
MARGIN-RIGHT: auto;
MARGIN-LEFT: auto;
}
.city { .city {
float: left; float: left;
margin: 5px; margin: 5px;
@ -83,15 +89,15 @@ border: 1px solid black;
</head> </head>
<body> <body>
<div id="main">
<div id="header"> <div id="header">
<h1>约球吧</h1> <h1>约球吧</h1>
</div> </div>
<div id="nav"> <div id="nav">
<a href="登录.html" style="text-decoration: none" target="_blank" >登录</a><br> <a href="登录.html" style="text-decoration: none" >登录</a><br>
<a href="注册.html" style="text-decoration: none" target="_blank">注册</a><br> <a href="注册.html" style="text-decoration: none" >注册</a><br>
<a href="个人中心.html" style="text-decoration: none" target="_blank">个人中心</a><br> <a href="个人中心2.html" style="text-decoration: none" target="_blank">个人中心</a><br>
<a href="当前订单.html" style="text-decoration: none" target="_blank">当前订单</a><br> <a href="当前订单.html" style="text-decoration: none" target="_blank">当前订单</a><br>
</div> </div>
@ -157,7 +163,7 @@ border: 1px solid black;
</a> </a>
</p> </p>
</div> </div>
</div>
</body> </body>
</html> </html>

@ -2,6 +2,19 @@
<html> <html>
<head> <head>
<style> <style>
#main{
width:1550px;
height:800px;
MARGIN-RIGHT: auto;
MARGIN-LEFT: auto;
}
#city{
margin: 5px;
padding: 15px;
width: 1550px;
height: 750px;
border: 1px solid black;
}
#button{ #button{
width:100px; width:100px;
height: 45px; height: 45px;
@ -32,11 +45,14 @@
</style> </style>
</head> </head>
<body background="图片/timg.jpg" > <body style="overflow: hidden;">
<div id="main">
<div id="city" style="background-image: url( 图片/timg.jpg);background-repeat:no-repeat;position: relative;left: -15px;top: -10px;">
<div id= "section"> <div id= "section">
</div> </div>
<div id="section1" style="background: url( 图片/QQ截图20190110153310.png);position: relative;left:-618px;bottom: -80px"> <div id="section1" style="background: url( 图片/QQ截图20190110153310.png);position: relative;left:-638px;bottom: -80px">
<div style=" background-color:#DC143C; position:relative;left: -32px;bottom: -80px; height:2px; width:300px;"> <div style=" background-color:#DC143C; position:relative;left: -32px;bottom: -80px; height:2px; width:300px;">
</div> </div>
<div style=" background-color:#DC143C; position:relative;left: -32px;bottom: -83px; height:1px; width:300px;"></div> <div style=" background-color:#DC143C; position:relative;left: -32px;bottom: -83px; height:1px; width:300px;"></div>
@ -105,5 +121,7 @@
<div style=" background-color:#D3D3D3; position:relative;left: 620px;bottom: -165px; height:1px; width:300px;"></div> <div style=" background-color:#D3D3D3; position:relative;left: 620px;bottom: -165px; height:1px; width:300px;"></div>
<div style=" background-color:#D3D3D3; position:relative;left: 620px;bottom: -230px; height:1px; width:300px;"></div> <div style=" background-color:#D3D3D3; position:relative;left: 620px;bottom: -230px; height:1px; width:300px;"></div>
<div style=" background-color:#DC143C; position:relative;left: 620px;bottom: -350px; height:2px; width:300px;"></div> <div style=" background-color:#DC143C; position:relative;left: 620px;bottom: -350px; height:2px; width:300px;"></div>
</div>
</div>
</body> </body>
</html> </html>

Loading…
Cancel
Save