| 编写网易邮箱登陆界面 | 您所在的位置：网站首页 › 网易邮箱登陆界面 › 编写网易邮箱登陆界面 |
编写网易邮箱登陆界面
|
一、HTML部分
1.网页主体部分
该部分编写了网页的主体部分。分为header main footer三个板块。 Document163网易邮箱 你的专业电子邮局 邮箱官方App VIP 会员 企业邮箱 海外登录 | 帮助 反馈 修复提示
网易首页
|
网易严选
|
政府公益热线
|
隐私政策
|
儿童隐私政策
|
网易公司版权所有©1997-2022
ICPC备案 粤B2-20090191-18
粤公安网安备 44010602006299
增值电信业务许可证
粤B2-20090191
B2-20090058
（中文邮箱第一品牌 数据来源：艾媒邮箱报告）
2iframe框架内部分
编写了iframe框架内部分，iframe内容是邮箱账号登陆、注册入口 Document 账号登陆 忘记密码 | 注册新账号 二、CSS部分对页面进行装饰。因为还处于初学阶段，所以可能存在一些较麻烦、不稳定的写法。 a{text-decoration:none} body{overflow:hidden} .header{ font-family: PingFangSC-Regular,Microsoft YaHei,"\5FAE\8F6F\96C5\9ED1",verdana,sans-serif,Simsun,STXihei; min-width: 1220px; padding: 0 40px; height: 70px; position: absolute; top:0px ; left: 0; right: 0; z-index: 2; } .headerlogo{ top:20px; left:40px; } .headerNav { position:absolute; top: 15px; right: 40px; text-align: right; color: #555; font-size: 12px; line-height: 17px; } .headerNav a{ padding-left: 12px; display: inline-block; vertical-align: middle; color: #585e6d; font-size: 12px; } .main{ position: absolute; top:250px; } .frame{ position: absolute; height: 450px; width:400px; top: -100px; left: -45px; border-radius: 10px; } .login{ position: absolute; left: 1000px; height:200px; margin-top: -20px; } .login-title{ position:absolute; top:30px; left:-860px ; } .loginurl{ position:absolute; top:110px; left:-960px ; } .register{ position: inherit; display: inline-block; vertical-align: middle; color: #585e6d; font-size: 13px; left:-860px ; bottom:-200px } input[type=text],input[type=password],select { width: 300px; padding: 12px 20px; margin: 8px; display: inline-block; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; } input[type=submit]{ width: 300px; padding: 12px 20px; margin: 8px; display: inline-block; background-color: rgb(56, 170, 219); border: 1px solid rgb(56, 170, 219); border-radius: 4px; box-sizing: border-box; } .picture{ position: inherit; left: 50px; top: -140px; } .footer{ position: absolute; bottom: 0; left: 0; right: 0; color: #888; min-width: 1220px; padding-top: 24px; padding-bottom: 24px; } .footermain{ height: 100%; background: #fbfbfb; position: relative; min-width: 1220px; } .footernav { text-align: center; color: #555; font-size: 12px; line-height: 60px; } .footernnav{ text-align: center; color: #555; font-size: 12px; line-height: 24px; } 三、成果展示
还没学习js，后期学习后会进行补充。交互部分用图片以静态的形式替代。 |
【本文地址】
公司简介
联系我们