学校网站模板 html-HTML 最终作业 作业

HTML期末作业作业-仿商城个人中心网站模板(HTML+CSS+JavaScript)

商城个人中心网站模板学校网站模板 html学校网站模板 html,全套模板,包括注册、登录、个人中心首页、实名认证、购物车、我的成长值、投诉、自营店面、我的购物优惠券、店铺收藏、安全设置、等等模板页面。

效果演示

代码


<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" href="css/amazeui.min.css" />
		<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
		<script type="text/javascript" src="js/amazeui.min.js"></script>
		<link rel="stylesheet" href="css/login.css" />
		<link rel="stylesheet" href="css/mui.min.css" />
		<script type="text/javascript" src="js/mui.min.js" ></script>
		<script type="text/javascript" src="js/login.js" ></script>
		<title></title>
		<style>
			.bottomLine{
				border-bottom: 1px solid #ccc;
				border-top: 1px solid #ccc;
				padding-top:8px;
				/*padding-bottom:10px;*/
				
			}
			.bot{
				/*margin-top: 5px;*/
				margin-bottom: 49px;
				/*text-align: center;*/
				color: #7b6f5b;
			}
		</style>
	</head>
     
	<body>
	
		<div class="am-g"  style="margin-top:30px;">
			<div style="width: 1200px;margin: 0 auto;">
			<div class="logo" >
				<img src="img/logo.png" />
			</div>
			<div style="float: right;margin-right: 60px;margin-top: 18px;">
				<span style="float: right;font-size: 12px;margin-left: 5px;color: #7d7d7d;"><span style="background-image: url(img/massageicon.png);width: 20px;height: 20px;margin-top:4px;float: left;background-repeat: no-repeat;margin-right: 8px;"></span>对登录页面的建议</span>
			</div>
			</div>
		</div>
		<div class="am-g content"  style="margin-top: 43px;">
			<div style="width:1200px;margin:0 auto;position: relative;z-index: 999;">
				<div class="loginDiv " style="display: block;"  id="login" >
						<div class="am-u-sm-12" style="padding-right: 0rem">
												
						</div>
					<div class="am-u-sm-12" style="padding-left: 30px;padding-right: 30px;">
					<h4 style="font-weight: normal;">欢迎登录</h4>
				 	<span class="left1"></span>	<input type="text" class="am-form-field"  placeholder="邮箱/手机号/用户名" style="padding-left: 50px;margin-top: 48px;font-size: 12px;"/>
				 </div>	
				 
				 <div class="am-u-sm-12" style="margin-top: 21px;padding-left: 30px;padding-right: 30px;">
				  <span class="left2"></span>	  
				 </div>	
				 <div class="am-u-sm-12" style="margin-top: 12px;padding-left: 30px;padding-right: 30px;font-size: 12px;color: #757575;">
				    <input type="checkbox" style="margin-top:1px;vertical-align:middle;"/><span style="margin-bottom:-1px;margin-left: 10px;font-size: 12px;vertical-align: middle;">自动登录</span>
				 </div>	
				
				<div class="am-u-sm-12" style="margin-top: 45px;padding-left: 30px;padding-right: 30px;">
				<button type="button" class="am-btn am-btn-warning" style="width: 100%;border-radius: 5px;font-size: 16px;" >登录</button>	
				</div>
				<div class="am-u-sm-12" style="padding-left: 30px;padding-right: 30px;">
					<p style="width: 100%;margin-top: 15px;font-size: 12px;color: #333333;">忘记登录密码 <span style="float: right;">免费注册</span></p>
				</div>
				
				</div>
				
				<div class="loginDiv" style="display: none;" id="erm"  >
						<div class="am-u-sm-12" style="padding-right: 0rem">
						<img src="img/pc_2.png" style="float: right;" id="ermimg" />						
						</div>
					<div class="am-u-sm-12" style="padding-left: 30px;padding-right: 30px;margin-top: 30px;text-align: center;">
					<h4 >手机扫码,安全登录</h4>
				</div>	
				 <div class="am-u-sm-12" style="padding-left: 30px;padding-right: 30px;margin-top: 50px;text-align: center;">
				 <img src="img/aerweima.png" />
				 </div>	
				 
				 <div class="am-u-sm-12" style="margin-top: 50px;padding-left: 30px;padding-right: 30px;text-align: center;">
				  <p style="font-size: 14px;">请使用买啦网客户端扫描二维码登录</p>
				    <p style="text-align: center;"><span style="background-image: url(img/Download-512.png);float: left;width: 20px;height: 20px;margin-top:5px;background-repeat: no-repeat;margin-left: 100px;"></span>
				<a style="float: left;font-size: 12px;"> 下载买啦客户端</a></p> 
				 </div>	
				<div class="am-u-sm-12" style="margin-top: 10px;padding-left: 30px;padding-right: 30px;margin-bottom: 100px;">
				</div>
				
				</div>
			</div>
		</div>
		<div class="am-g " style="margin-top: 81px;text-align: center;font-size: 12px;">
			<div class="bottomLine" style="margin:0 auto;width:700px;height: 35px;">
			<span style="float: left;word-spacing:0.52rem;    text-align: center;    width: 100%;">关于我们 | 联系我们 | 商家入驻 | 友情链接 | 站点地图 | 手机商城 | 销售联盟 | 商城社区 | 企业文化 | 帮助中心 
			</span>
			</div>
	    </div>	
	    <div class="am-g" >
				<div class="bot ">
					<div  style="margin:0 auto;width:700px;height: 30px;">
				<p style="font-size: 12px;float: left; line-height: 10px;">©  2005-2016 买啦网 版权所有 ,并保留所有权利  <span  style="margin-left: 30px;">买啦 Tel :4008125181 </span><span  style="margin-left: 20px;">E-mai:maila@163.com</span>  </p>
					</div>
					</div>
		</div>
		
	</body>
</html>

一个制作精良的网页如何发送链接给别人看疗效? 1.1 解决部署启动~>部署启动工具(永久免费使用)

1.您无需购买服务器即可部署在线,全世界都可以访问您的连接。 这里推荐一款程序员必备的工具~

该插件集成了很多好用的插件,免费下载安装,简单易懂,简直就是利器啊~需要的可以在文章下方公众号Z获取↓

2、你的代码效果完成后,部署到网上,把链接发给别人,让对方通过你的链接点击进去,你就可以看到你网页的效果了,电脑端和手机端都可以! (不然别人就得发文件才能查看你的网页,体验会不太好~)

1.1 部署流程

1.2 哇~部署成功

哇~部署成功了! 你写的页面部署上线后,全世界的人都可以通过链接访问你的网页(永久免费使用)~

前端零基础入门到中级(视频+源码+开发软件+学习资料+面试题)全套(教程)

适合初学者到中级童鞋~

源代码获取

~关注我,点赞博文~我每天都会给你带来更多知识!

1.如果您看到此内容,请【点赞+收藏】连续三连支持。 您的“点赞、收藏”是我创作的动力。

2.关注我~每天带你学习:各种后端插件、3D炫丽效果、图片展示、文字效果,还有全站模板、大学生毕业模板、期末作业模板等! “这里有很多前端开发人员,一起讲解前端Node知识,互相学习!”

3.以上内容相关的技术问题可以互相学习,也可以关注↓公众号Z获取更多源码!

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

悟空资源网 网站模板 学校网站模板 html-HTML 最终作业 作业 https://www.wkzy.net/game/142696.html

常见问题

相关文章

官方客服团队

为您解决烦忧 - 24小时在线 专业服务