写一个电商个人中心的html界面
时间: 2023-11-04 07:05:03 浏览: 22
<!DOCTYPE html>
<html>
<head>
<title>电商个人中心</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<header>
<h1>电商个人中心</h1>
</header>
<nav>
<ul>
<li><a href="#">我的订单</a></li>
<li><a href="#">我的购物车</a></li>
<li><a href="#">我的收藏</a></li>
<li><a href="#">个人资料</a></li>
<li><a href="#">修改密码</a></li>
<li><a href="#">退出登录</a></li>
</ul>
</nav>
<main>
<section>
<h2>我的订单</h2>
<p>您还没有任何订单</p>
</section>
<section>
<h2>我的购物车</h2>
<p>您的购物车还是空的</p>
</section>
<section>
<h2>我的收藏</h2>
<p>您还没有收藏任何商品</p>
</section>
<section>
<h2>个人资料</h2>
<form>
<label for="username">用户名:</label>
<input type="text" id="username" name="username" value="张三"><br>
<label for="email">电子邮件:</label>
<input type="email" id="email" name="email" value="zhangsan@example.com"><br>
<label for="phone">手机号码:</label>
<input type="tel" id="phone" name="phone" value="13812345678"><br>
<label for="address">联系地址:</label>
<input type="text" id="address" name="address" value="北京市海淀区"><br>
<input type="submit" value="保存">
</form>
</section>
<section>
<h2>修改密码</h2>
<form>
<label for="oldpassword">旧密码:</label>
<input type="password" id="oldpassword" name="oldpassword"><br>
<label for="newpassword">新密码:</label>
<input type="password" id="newpassword" name="newpassword"><br>
<label for="confirmpassword">确认密码:</label>
<input type="password" id="confirmpassword" name="confirmpassword"><br>
<input type="submit" value="修改">
</form>
</section>
</main>
<footer>
<p>© 2021 电商个人中心</p>
</footer>
</body>
</html>