HTML5前端开发入门之网易注册界面实战

最新推荐文章于 2024-05-03 13:32:20 发布

小韩同学哇

最新推荐文章于 2024-05-03 13:32:20 发布

阅读量1k

点赞数

分类专栏：从零玩转Html5前端开发

本文链接：https://blog.csdn.net/qq_41886761/article/details/85397686

版权

代码如下：

图片可通过谷歌浏览器在网易邮箱官网直接下载
<!DOCTYPE html>
<html lang="en" xmlns:http="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>网易邮箱注册界面</title>
    <style>
        body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,
        form,fieldset,legend,input,textarea,p,blockquote,th,td
        {
            margin:0;
            padding:0;
        }
        body{
            background-color: #f9f9f9;
            font-size: 12px;
        }
        .header{
            width: 960px;
            height: 81px;
            margin: 0 auto;
            padding-top: 30px;
            box-sizing: border-box;
        }
        .header .logo{
            width: 644px;
            height: 27px;
            background:url("../images/wy.png") no-repeat 0 0;
            float: left;
        }
        .header .logo a{
            display: inline-block;
            width: 128px;
            height: 27px;
        }
        .header .links{
            width: 200px;
            height: 19px;
            text-align: right;
            float: right;
            color: #999;
        }
        .header .links a{
            text-decoration: none;
            line-height: 19px;
            color: #039;
        }
        .header .links a:hover{border-bottom:1px solid #039;}
        .content{
            width: 960px;
            height: 727px;
            margin: 0 auto;
        }
        .content .top{
            width: 958px;
            height: 38px;
            background-color: #6495C6;
            border: 1px solid #5B88B8;
            border-radius: 3px 3px 0 0;
        }
        .content .top h1{
            font-size: 14px;
            color: white;
            line-height: 38px;
            padding-left: 20px;
        }
        .content .bottom{
            width: 960px;
            height: 687px;
            background-color: white;
        }
        .content .bottom .left{
            width: 642px;
            height: 687px;
            float: left;
            padding-left: 60px;
            padding-top: 50px;
            box-sizing: border-box;
            border: 1px solid #ccc;
            border-top: none;
            border-right: none;
        }
        .content .bottom .left .leftTop{
            width: 582px;
            height: 58px;
            padding-left: 55px;
            box-sizing: border-box;
        }
        .content .bottom .left .leftTop ul{
            width: 412px;
            height: 35px;
            background-image: url("../images/wy3.jpg");
            background-repeat: no-repeat;
            list-style: none;
        }
        .content .bottom .left .leftTop ul li{
            float: left;
            width: 137px;
            height: 35px;
            line-height: 35px;
            text-align: center;
        }
        .content .bottom .left .leftBottom{
            width: 573px;
            height: 543px;
            margin-left: 9px;
        }
        .content .bottom .left .leftBottom .txt-tips{
            color: rgb(153, 153, 153);
        }
        .conte

最低0.47元/天解锁文章

小韩同学哇

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML5前端开发入门之网易注册界面实战

代码如下：图片可通过谷歌浏览器在网易邮箱官网直接下载&lt;!DOCTYPE html&gt;&lt;html lang="en" xmlns:http="http://www.w3.org/1999/xhtml"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;网易邮箱注册
复制链接

扫一扫