模仿邮件登录系统

模仿邮件登录系统

 

码云代码库：https://gitee.com/pinaomansgitee/mail_login.git

 

实验结果图：

 

 

 

验证用户名、密码不能为空，并提示

用户名或密码错误提示

 

用户名、密码正确，跳转到新的页面

 

部分html css 代码（完整版可在码云库中fork）:

 

Js: 实现鼠标移动到登录按钮变色 以及 点击对用户名 密码进行验证：

 

实验总结：

1．模仿界面 用f12 查看原网页的代码布局 获取一些颜色字体参数以及图片资源

右边为html 布局内容，左边则是样式；

 

2.过程中将一些元素并排显示 以及 某些margin padding失效时 可使用 float ，但注意清理浮动；

 在float的上一级元素 class中添加