login登录页面
代码地址:https://gitee.com/ZeroLuo328/j2ee_course/tree/master/
https://gitee.com/ZeroLuo328/j2ee_course/tree/master/login%E9%A1%B5%E9%9D%A2
1.分析页面布局
2.简单画出布局
3.获取图片资源
右键点检查或者f12
找到资源open in new tab 下载即可
4.创建基本布局
布局:
css:
效果:
5.header部分
这部分有个logo,有个帮助,所以要改变div的布局,注意子绝父相这个规律
把page_head的颜色设置成logo的颜色
6.content部分
注意看用户登录提示哪儿有对点不对,因为有些盒子有默认的外边距和内边距,要消除掉
现在就对了
7.foot部分
8.js静态密码验证,以及消息提示
用户名密码正确就跳转到
https://mail.swpu.edu.cn/
9.代码地址:
https://gitee.com/ZeroLuo328/j2ee_course/tree/master/
https://gitee.com/ZeroLuo328/j2ee_course/tree/master/login%E9%A1%B5%E9%9D%A2