版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。
目录
最近学一下html+css,按照老师傅的指导,新手最好的方法不是去看书而是coding。
于是大致翻阅了一些教程:
觉得入门了啊,怎么去验证下呢,做点东西吧,京东登陆页面搜出来:https://passport.jd.com/new/login.aspx
开始按这个模拟。
页面整体架构
目标:
先分析下页面架构,大三类:header、content、footer
header有啥?
logo,图片欢迎登陆,文字调查问卷链接,超链接
content有啥?
一个警告区域一张大图一个背景色的box,背景色跟图片一致一个背景色的box,背景色跟图片一致一个登陆框
footer有啥?
很多链接版权说明
登陆框是最复杂的:
警告区域登陆方式选择:扫码、账号登陆警告区域,隐藏的,账号错误时会显示账号框=icon+input框密码框=icon+input框忘记密码登陆按钮其他登陆方式:qq、微信登陆注册按钮
代码架构:
根目录子目录
index.html
static文件夹logo.png
bg.jpg
login.css
效果
页面实现
login.index