第二次作业

Part1:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>作业5</title>
    <style>
        div{
            width: 1400px;
            height: 45px;
            margin: auto;
            text-align: center;
            text-shadow: 10px 10px 10px rgb(255, 255, 255);
            border-color: rgb(42, 42, 99);
            box-shadow: 10px 10px 10px grey;
            border-style: solid;
            background-color: rgb(42, 42, 99);
            color: white;
            font-size: 25px;
            border-radius: 15%;
        }
        [class^="游戏"]:hover{
            width:20px;
            height: 60px;
            margin: auto;
            padding: auto;
            background-color: rgb(114, 8, 8);
        }
        [class^="游戏"]{
            width:20px;
            height: 60px;
            margin: auto;
            padding: auto;
            font-weight: 900;
        }
        </style>
</head>
<body>
    <div> 
         <span class="游戏A">游戏1</span>&nbsp;&nbsp;&nbsp;
         <span class="游戏B">游戏2</span>&nbsp;&nbsp;&nbsp;
         <span class="游戏C">游戏3</span>&nbsp;&nbsp;&nbsp;
         <span class="游戏D">游戏4</span>&nbsp;&nbsp;&nbsp;
         <span class="游戏E">游戏5</span>&nbsp;&nbsp;&nbsp;
         <span class="游戏F">游戏6</span>&nbsp;&nbsp;&nbsp;
         <span class="游戏G">游戏7</span>&nbsp;&nbsp;&nbsp;
         <span class="游戏H">游戏8</span>&nbsp;&nbsp;&nbsp;
         <span class="游戏I">游戏9</span>&nbsp;&nbsp;&nbsp;
    </div>
</body>
</html>

Part2:

(1)京东登录页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>京东登录</title>
    <style>
        input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{
            color: lightgray;
            font-size: 12px;
        }
    </style>
</head>
<body>
    <div style="width: 1520px; height: 83px;border: 1px red;">
        <div class="大logo" style="width: 400px; height: 70px;color: #666666; font: 12px;margin: 10px 0px;border: 1px  red;margin-left: 270px;float: left;">
            <div style="width: 180px; height: 70px; border: 1px  red;float: left;"><img src="./京东logo.png" alt="" style="width: 180px; height: 70px;float: left;"></div>
            <div style="border: 1px  red; width: 210px;height: 70px;float: left;"><span style="color: rgb(67, 66, 66);padding-bottom: 20px;float: left;padding-left: 20px;padding-top: 25px;"><big><big>欢迎登录</big></big></span></div>
        </div>
        <div class="右上角tips" style="width: 540px;height: 35px; border: 1px  red; float: right;margin-top: 42px;">
            <div class="右上角tipslogo" style="width: 35px;height: 35px;border: 1px  red; margin-left: 130px;float: left;"><a href="https://www.jd.com"><img src="./京东-对话框小logo.png" alt="" style="width: 25px;height: 18px;padding-left: 10px;padding-top: 5px;"></a></div>
            <div class="右上角小字" style="width: 120px;height: 35px;border: 1px  red;float: left;">
                <span style="font-size: 11.5px;color: #999999;padding-left: 5px;padding-top: 20px;">登录页面&nbsp;,&nbsp;改进建议</span>
            </div>
        </div>
    </div>
    <div style="width: 1520px; height: 38px;border: 1pxred;background-color: #FFF8F0;" class="second">
    <div style="width: 810px;height: 20px; border: 1px  red;margin-left: 330px;margin-top: 8px;">
        <span style="color:#999999;font-size: 12px;">依据《网络安全法》,为保障您的账户安全和正常使用,请尽快完成手机号验证! 新版《京东隐私政策》已上线,将更有利于保护您的个人隐私。</span>
    </div>
    <div style="width: 1520px;height: 470px; border: 1px  red;margin-top: 10.2px;background-color: rgb(236, 64, 64);float: left;">
        <img src="./京东登录大图.png" alt="" width="700px" height="470px" style="padding-left: 330px;float: left;">
        <div style="width: 300px;height: 335px;border: 1px blue;float: left;margin-top: 80px;background-color: white; border-radius: 10px;">
            <div class="xiao" style="width: 300px; height: 25px;border: 1px purple;background-color: #FFF8F0;margin-top: 5px;">
                <span style="width: 228px; height: 16px;color: #FF860D;font-size: 12px;align-items: center;padding-left: 30px;margin-top: 35px;">
                    京东不会以任何理由要求您转账,谨防诈骗
                </span>
            </div>
            <div style="width: 300px; height: 258px;color: #666666; font-size: 12px;background-color: #FFFFFF;border: 1px purple;">
                <div style="width: 300px;height: 70px; border: 1px purple;float: right;">
                    <div style="float: left;border: 1px purple;"><span style="color: white; background-color: rgb(152, 150, 150);width: 110px; height: 20px;float: left;margin-left: 135px;margin-top: 5px;align-self: center;">扫码登录安全快捷</span></div>
                <div style="float: left; border: 1px purple;width: 50px; height: 50px;">
                    <img src="./京东登录二维码.png" alt="" style="width: 48px; height: 48px;margin-bottom: 20px;">
                </div>
                <div style="width: 245px;height: 30px;border: 1px purple;margin-top: 30px;">
                <div style="width: 100px;height: 20px;border: 1px purple;float: left;">
                    <span style="font-size: 17px;color: #FA2C19;align-items: center;margin-bottom: 20px;margin-left: 15px;float: left;">
                        <b>密码登录</b>
                    </span>
                </div>
                <div style="width:100px;height: 20px;border: 1px  purple;float: left;">
                    <span style="font-size: 17px;color: #666666;float: left;">短信登录</span>
                </div>
                </div>
                <div style="width: 300px;height: 160px;border: 1px purple;margin-top: 10px;">
                    <div style="width: 268px;height: 36px;color: #666666;font-size: 12px;font-family: 宋体;">
                        <input type="text1" id="text1" width="300px" height="34px" placeholder="账号名/手机号/邮箱" style="padding-left: 20px;padding-top: 20px;background-color: #FFFFFF;padding: 9px 10px;margin-left: 20px;padding-right: 90px;border-radius: 4px;border:1px solid lightgray;" >
                    </div>
                    <div style="width: 268px;height: 36px;color: #666666;font-size: 12px;font-family: 宋体;">
                        <input type="password" id="password" width="300px" height="34px" placeholder="密码" style="padding-left: 20px;padding-top: 20px;background-color: #FFFFFF;padding: 9px 10px;margin-left: 20px;padding-right: 90px;border-radius: 4px;border:1px solid lightgray;margin-top: 17px;" >
                    </div>
                   <div style="width: 290px;height: 28px;border: 1px purple;margin-top: 20px;">
                    <a href="" style="color: rgb(132, 131, 131);font-size: 12px;padding-left: 235px;padding-top: 18px;">忘记密码</a>
                    </div>
                    <div style="width: 268px;height: 34px;border: purple;margin-left: 14px;background-color: #f79188;border-radius: 7px;">
                        <div style="width: 70px;height: 20px;border:  purple;color: white;font-size: 14px;padding-top: 5px;padding-left: 110px;">
                            <span><b>登&nbsp;&nbsp;&nbsp;&nbsp;录</b></span>
                        </div>
                    </div>
                    <div style="width: 300px; height: 43px;border: 1px purple;margin-top: 29px;float: left;background-color: #F6F6F6;">
                        <div style="width: 75px;height: 30px;border: 1px purple;margin-left: 20px;margin-top: 7px;float: left;">
                            <img src="./QQ-logo.png" alt="" width="25px" height="25px" style="float: left;">
                            <span style="float: left;padding-left: 2px;padding-top:5px ;">QQ</span>
                        </div>
                        <div style="width: 75px;height: 30px;border: 1px purple;margin-top: 7px;float: left;">
                            <img src="./微信-logo.png" alt="" width="25px" height="25px" style="float: left ;float: left;">
                            <span style="float: left;padding-left: 2px;padding-top: 5px;">微信</span>
                        </div>
                        <div style="width: 75px;height: 30px;border: 1px purple;float: right;margin-top: 13px ;">
                            <span style="padding-left: 10px;margin-top: 50px; ">立刻注册</span>
                        </div>
                    </div>
                </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    <div style="width: 1520px;height:86px;border: 1px  purple;margin-top: 470px;font-family: 宋体;" class="Third">
        <div style="width: 1520px;height: 36px;border: 1px purple;">
            <div style="width: 950px;height: 20px;border: 1px purple;margin-left: 270px;color: #666666;font-size: 12px;margin-top: 20px;">
            <a style="float: left;margin-left: 120px;">关于我们&nbsp;</a><div style="width: 2px;height: 12px;float: left;background: #CCCCCC;margin-top: 1px;"></div>
            <a style="float: left;">&nbsp;联系我们&nbsp;</a><div style="width: 2px;height: 12px;float: left;background: #CCCCCC;margin-top: 1px;"></div>
            <a style="float: left;">&nbsp;人才招聘&nbsp;</a><div style="width: 2px;height: 12px;float: left;background: #CCCCCC;margin-top: 1px;"></div>
            <a style="float: left;">&nbsp;商家入驻&nbsp;</a><div style="width: 2px;height: 12px;float: left;background: #CCCCCC;margin-top: 1px;"></div>
            <a style="float: left;">&nbsp;广告服务&nbsp;</a><div style="width: 2px;height: 12px;float: left;background: #CCCCCC;margin-top: 1px;"></div>
            <a style="float: left;">&nbsp;手机京东&nbsp;</a><div style="width: 2px;height: 12px;float: left;background: #CCCCCC;margin-top: 1px;"></div>
            <a style="float: left;">&nbsp;友情链接&nbsp;</a><div style="width: 2px;height: 12px;float: left;background: #CCCCCC;margin-top: 1px;"></div>
            <a style="float: left;">&nbsp;销售联盟&nbsp;</a><div style="width: 2px;height: 12px;float: left;background: #CCCCCC;margin-top: 1px;"></div>
            <span style="float: left;">&nbsp;京东社区&nbsp;</a><div style="width: 2px;height: 12px;float: left;background: #CCCCCC;margin-top: 1px;"></div>
            <a style="float: left;">&nbsp;京东公益&nbsp;</a><div style="width: 2px;height: 12px;float: left;background: #CCCCCC;margin-top: 1px;"></div>
            </div>
        </div>
        <div style="width: 350px;height: 25px;border: 1px purple;margin-left: 550px;margin-top: 10px;">
            <span style="color: #666666;font-size: 11px;padding-left: 80px;">Copyright &copy; 2004-2024  京东 JD.com 版权所有</span>
        </div>
    </div>
</body>
</html>

(2)国际版Interpark购买门票的网页

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>边-自</title>
    <style>
       
        div{
            display: inline-block;
        }
        span{
            display: block;
        }   
        .input1::placeholder{
            color:black;
            font-size: 12px;
        }
   
    </style>
</head>
<body>
    <div style="padding: 30px 0px 10px; width: 1800px; height: 160px;">
        <div style="padding-left: 60px;" class="box">
            <img src="./interpark-logo.png" alt="Interpark" style="width: 151px; height: 46px; padding-top: 17px;">&nbsp;&nbsp;&nbsp;
            <input id="search" type="search" style="font-size: 15px; line-height: 18px; width: 452px; height: 50px; padding: 16px 40px 16px 16px; outline: none; border-radius: 25px; border: 1px solid rgb(232, 232, 232);">
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            登录&nbsp;&nbsp;&nbsp;注册会员&nbsp;&nbsp;&nbsp;我的主页&nbsp;&nbsp;&nbsp;FAQ&nbsp;&nbsp;&nbsp;中文
        </div>
        <div style="width: 1800px;height: 50px;padding-left: 62px;padding-top: 35px;">
           <strong>
            <a href="" style="color: black; font-size: 16px">Play & Stay</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="" style="color: black;font-size: 17px">演唱会</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="" style="color: black;font-size: 17px">音乐剧</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="" style="color: black;font-size: 17px">演出</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="" style="color: black;font-size: 17px">展览会</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="" style="color: black;font-size: 17px">体育比赛</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="" style="color: black;font-size: 17px">舞蹈·传统艺术</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="" style="color: black;font-size: 17px">闲暇</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="" style="color: black;font-size: 17px">古典 · 歌剧</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <img src="./分割号.png" alt="" style="width: 10px; height: 27px;">&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="" style="color: black;font-size: 17px">公告 · 活动</a>
           </strong>
        </div>
    </div>
    <div style="width: 1800px; height: 9830px;color: #666666; font-size: 12px;background-color: #FFFFFF;border:1px solid rgb(231, 229, 229);border: 1px solid rgb(165, 159, 159);">
        <div style="width: 874.6px;height: 379.98px;color: #666666; font-size: 12px; background-color: #F8F9FB; padding: 20px;margin-left: 300px;border: 1px solid rgb(221, 220, 220);box-shadow: 1px 2px rgb(219, 218, 218);">
        <div style="width: 200px;height: 270px;float: left;"><img src="./边-小.png" alt="Interpark" style="height: 270px;width: 190px;" >
        </div>
        <div style="width: 403px; height: 285px;color: #666666;font-size: 12px; margin: 0px 20px; border: 1px red;float: left;">
            <div style="width: 400px;height: 55.8px;color: #000000;"><span style="width: 370.81px; height: 37px;font-size: 14px; color: #000000;">
                <strong>2024 ByeonWooSeok Asia Fanmeeting Tour 〈SUMMER LETTER〉 in Seoul</strong>
            </span>
        </div>
            <hr>
            <ul type="square" style="color: grey">
                <li style="font-size: 12px;margin: 5px 0px;padding: 0px 0px 0px 0px;">
                    <strong>
                        <span style="float: left;">具体分类:</span>
                    </strong>
                        <span style="float: left;">&nbsp;&nbsp;演唱会</span>
                        &nbsp;&nbsp;
                </li> 
                <li style="font-size: 12px;margin: 5px 0px;padding: 0px 0px 0px 0px;">
                    <strong><span style="float: left;">日期:</span></strong>
                    <span style="float: left;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2024-07-06~2024-07-07&nbsp;&nbsp;</span>
                </li>
                <li style="font-size: 12px;margin: 5px 0px;padding: 0px 0px 0px 0px;">
                    <strong><span style="float: left;">场所:</span></strong>
                    <span style="float: left;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Jangchuang Arena&nbsp;&nbsp;</span>
                </li>
            </ul>
            <hr>
            <ul type="square" style="color: grey">
                <li style="font-size: 12px;margin: 5px 0px;padding: 0px 0px 0px 0px;">
                    <strong><span style="float: left;">等级:</span></strong>
                    <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;7岁以上观众</span>
                </li>
                <li style="font-size: 12px;margin: 5px 0px;padding: 0px 0px 0px 0px;">
                    <strong><span style="float: left;">观赏时间:</span></strong>
                    <span style="float: left;">&nbsp;&nbsp;100分钟</span>
                </li>
            </ul>
            <hr>
            <ul type="square" style="color: grey">
                <li style="font-size: 12px;margin: 5px 0px;padding: 0px 0px 0px 0px;">
                    <strong><span style="float: left;">价格:</span></strong>
                    <div style="width: 270px;height: 63.5px;border: 1px red;">
                        <span style="float: left; "><font style="color: black;"><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;更多价格</strong></font></span>
                    <br>
                    <span style="float: left; margin: 10px 0px;padding: 0px 0px 0px 0px;padding-left: 35px;">全席(现场接待) &nbsp; 77,000 韩元</span>
                    <span style="float: left;margin: -3px 0px;padding: 0px 0px 0px 0px;padding-left: 35px;">全席 &nbsp; 77,000 韩元 </span>
                    </div>
                </li>
            </ul>
        </div>
        <div style="width: 210px; height: 360px; color: #666666; font-size: 12px;background: #F1F3F5;;border: 1px solid #EAECEE;float: left;">
            <div style="width: 210px; height: 48.4px; color: #666666;font: 12px; background: #EAECEE;padding-left: 0px;padding: top 0px;border: 1px solid rgb(231, 229, 229);float: left;">
                <span style="padding-left: 15px;padding-top: 8px;float: left;"><strong>可预购演出</strong></span>
                <span style="padding-left: 15px;padding-top: 3px;float: left;">2024-07-06 &nbsp;~&nbsp;2024-07-07</span>
            </div>
            <div style="width: 210px; height: 289px;color: #666666;font: 12px;border: 1px red;float: left;">
            <ul style="list-style: none;padding: 3px 15px 7px;float: left;">
                <li style="padding-left: 0px;float: left;">
                    <span><strong>日期</strong>&nbsp;&nbsp;&nbsp;<input type="text" class="input1" placeholder="请选择观看日期。" style="width: 130px; height: 10px;"></span>
                </li>
                <li style="padding-top: 8px;float: left;">
                    <span><strong>场次</strong>&nbsp;&nbsp;&nbsp;<input type="text" class="input1" placeholder="请选择观看时间。" style="width: 130px; height: 10px;"></span>
                </li>
            </ul>
            <ul style="list-style: none;padding:0px 15px 7px;float: left;">
                <li style="float: left;">
                    <span><strong>可预约的座位</strong></span>
                </li>
                <li style="float: left;">
                    <textarea name="emm" id="emm" cols="22px" rows="6" style="border: white;"></textarea>
                </li>
            </ul>
            <div style="width: 210px; height: 85px;color: #666666; font: 12px;border: 1px red;margin: 0px;float: left;">
            <img src="./边-预约.png" alt="预约" style="width: 183; height: 27px;padding-left: 20px;">
            <img src="./边-English booking.png" alt="" style="width: 180; height: 27px;padding-left: 20px;">
            <img src="./边-日语预约.png" alt="" style="width: 183; height: 27px;padding-left: 20px;">
            </div>
            </div>
        </div>
        </div>
        <div style="width: 726px;height: 9300px; color: #666666; font: 12px;border: 1px rgb(162, 155, 155); margin-left: 300px;padding: 20px;float: left;">
            <div style="width: 770px;height: 70px;color: #666666; font: 12px;border: 1px red;margin: 0px 0px 0px;float: left;">
                <div style="width: 358px; height: 70px; border: 1px red;float: left;margin-left: 0px;">
                    <img src="./边-提示语1.png" alt="" style="width: 358px; height: 70px;">
                </div>
                <div  style="width: 358px; height: 70px; border: 1px red;float: left;padding-left: 5px;margin-left: 15px;">
                    <img src="./边-提示语2.png" alt="" style="width: 358px; height: 70px;">
                </div>
            </div>
            <ul style="width: 726px; height: 35px;color: #666666;font: 12px;">
                <a href="" style="width: 164px; height: 33px; background: #555555;float: left;margin-top: 20px;text-align: center;"><span style="color: white;padding-top: 7px;"><strong>有关演出的具体内容</strong></span></a>
                <a href="" style="width: 128px; height: 33px; background: #D5D5D5;float: left;margin-top: 20px;text-align: center;"><span style="color: grey;padding-top: 7px;"><strong>演出场所指南</strong></span></a>
            </ul>
            <br>
            <br>
            <br>
            <br>
            <br>
            <br>
            <p>※ 本演出为了防止Macro/加价购票/用户名转购等用不正当方法进行交易,采用另外的门票取消系统。<br>
            ※ 关于本次演出,演出制作公司正在持续对门票的非法交易进行监督。<br>
            被视为通过非正常途径访问等的不正常预购和交易,将依次要求提交申辩资料及取消预购。<br>
            要求申辩时,应在限期内回复,如果未回复,将会无另行通知的情况下取消预购。(因填写的联系电话及电子邮箱地址不正确,无法收到<br>
            相关通知时,也视为未回复,并取消预购。)<br>
            包括上述情况在内,对于因不遵守预购注意事项而发生的所有问题,演出主办方、承办方和预售处将不负有任何责任,因此预购时一定要<br>
            特别注意,以免受到损失。
            </p>
            <p>
                <img src="./边-大海报.png" alt="" style="width: 800px; height: 9000px;">
            </p>
           
        </div>
            <div style="width: 125px;height: 227px;color: #666666;font: 12px; background: #F8F9FB; border: 1px solid rgb(162, 155, 155) ;float:left;margin-top: 20px;margin-left: 20px;">
                <div style="width: 123px;height: 35px;background: #EBEFF2;">
                    <span style="padding-left: 15px;padding-top: 7px;color: black;"><strong>预约排行榜</strong></span>
                </div>
                <div style="width: 123px;height: 190px;color: #666666;font: 12px;border: 1px red;">
                    <span style="padding-left: 15px;padding-top: 7px;color: rgb(100, 98, 98);"><strong>演唱会</strong></span>
                    <span style="padding-left: 15px;padding-top: 7px;color: rgb(100, 98, 98);"><strong>前50名</strong></span>
                    <ul type="square" style="padding-left: 30px;padding-top: 0px;color: rgb(172, 169, 169);">
                        <li><span>一天&nbsp;30</span></li>
                        <li><span>一周-</span></li>
                        <li><span>一个月&nbsp;9</span></li>
                    </ul>
                    <div style="width: 36px;height: 39px;color: #666666;float: left;border: 1px red;padding-left: 15px; padding-top: 7px;">
                        <span style="color: rgb(100, 98, 98);"><strong>观后感</strong><span>-</span></span>
                    </div>
                    
                <div style="width: 48px;height: 39px;color: #666666;float: left;border: 1px red;padding-left: 2px; padding-top: 7px;">
                    <span style="color: rgb(100, 98, 98);"><strong>专家评论</strong><span>-</span></span>
                </div>
                </div>
                
            </div>
            <div style="width: 1600px;height: 160px;border: 1px solid rgb(162, 155, 155);padding: 0px 0px 40px;text-align: center;">
                <span style="float: left;margin-top: 20px;margin-left: 70px;"><strong>关于我们</strong></span>
                <div style="width: 2px;height: 12px; background: #CCCCCC;float: left;margin-top: 20px;margin-left: 110px;"></div>
                <span style="float: left;margin-top: 20px;margin-left: 70px;"><strong>TRIPLE global</strong></span>
                <div style="width: 2px;height: 12px; background: #CCCCCC;float: left;margin-top: 20px;margin-left: 110px;"></div>
                <span style="float: left;margin-top: 20px;margin-left: 70px;"><strong>使用条款</strong></span>
                <div style="width: 2px;height: 12px; background: #CCCCCC;float: left;margin-top: 20px;margin-left: 110px;"></div>
                <span style="float: left;margin-top: 20px;margin-left: 70px;"><strong>电子金融交易条款</strong></span>
                <div style="width: 2px;height: 12px; background: #CCCCCC;float: left;margin-top: 20px;margin-left: 110px;"></div>
                <span style="float: left;margin-top: 20px;margin-left: 70px;"><strong>青少年保护政策</strong></span>
                <div style="width: 2px;height: 12px; background: #CCCCCC;float: left;margin-top: 20px;margin-left: 110px;"></div>
                <span style="float: left;margin-top: 20px;margin-left: 70px;"><strong>Language</strong></span>
                <div style="width: 2px;height: 12px; background: #CCCCCC;float: left;margin-top: 20px;margin-left: 90px;"></div>
                <div style="width: 1600px; height: 60px;border: 1px solidrgb(162, 155, 155);margin-top: 28px;">
                <span style="padding-top: 30px;color: #11111180;">InterparkTriple Corp.是通信销售的中介,不是通信销售的当事者, 因此对个别卖家登记的OPEN MARKET商品不会承担任何责任。</span>
                <span style="padding-top: 5px;color: #11111180;"><strong>地址</strong> 06611 首尔市瑞草区江南大路447 <strong>事业者登陆编号</strong> 824-81-02515 <strong>通讯销售业登记</strong> 2022首尔江南02179号 <strong>代表理事</strong> Hwi-Young Chae <strong>电话号码</strong> (+82) 1544-1555 <strong>票务咨询</strong> tickethelp@interparktriple.com</span>
                <span style="padding-top: 5px;color: #11111180;">Copyright &copy; InterparkTriple Corp. All rights reserved.</span>
            </div>
            </div>
        </div>
</body>
</html>

中间为一张大图

(3)中南林业科技大学涉外学院教务处登陆页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学习官网-登录</title>
    <style type="text/css">
        body,div,dl,dt,p,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,th,td { 
            padding:0; 
            margin:0 auto; font-family:"微软雅黑"
        } 
        a{
            color:#999;
            text-decoration: none;
        }
        .wapbg{height:446px;}
        .wap{ margin:0 auto; width:955px;}
        .top{ height:150px; padding-left:85px;}
        .middle{ height:296px;background:#DDDDDD no-repeat; height:296px;position:relative; width:955px;}
        .dl{width:312px;height:230px;position:absolute;right:60px;top:30px}
        .logintitle{font-size:24px;color:#333;padding-bottom: 20px;}
        .dlmi{ float:left; width:312px; line-height:45px;font-size:17px;color:#333;position:absolute;top:70px;}
        .input {  height:28px;border:1px solid #DDDDDD;padding-left: 3px;}
        .dlj{ color:#666;position:absolute;top:180px;left:77px;width: 113px;}
        .inputSmt{height:45px;width:45px;font-size:16px; cursor: pointer;}
        .dlau a{ display:block; width:45px; height:45px;}
        .dlau1{height:45px;width:45px;font-size:16px;}
        .dlau1 a{ display:block; width:45px; height:45px;}
        .end{position:absolute;font-size:15px;color:#999;width:809px;left: 85px;top: 304px;}
        .end .leftclass{float:left;display: block;}
        .end .right{float:right;display: block;} 
        .copyright{color:#999;}
        .trclass{height:40px;text-align:right;padding-right: 5px;}
        
        .button{ 
            height:36px; 
            line-height:22px;  
            width:188px;
            color:#FFF; 
            background-color:#2F88EE; 
            border:0px;
            padding-left:5px;
            padding-right:5px; 
            cursor: pointer;
            font-size:16px; 
        }
        .buttonover{ 
            height:36px; 
            line-height:22px;  
            width:188px;
            color:#FFF; 
            background-color:#ABCAE9; 
            border:0;
            padding-left:5px;
            padding-right:5px; 
            cursor: pointer; 
            font-size:16px;
        }
        
        .dlti{
            font-size:20px;
            color:#333;
            position:absolute;
            top:5px;
            width: 312px;
        }
        .dl_box2 div{padding-top:100px;text-align:center}
        .dlti li{ float:left;list-style:none; text-align:center;width:50%; } 
        .dlti li a{display:block;}
        .dlti .act{border-bottom:2px solid #1A4F80;color:#1A4F80; float:left;}
        .dlti .ks{float:right;}
        .dl_hidden{height:300px}
     </style>
</head>
<body>
    <form name="frm" id="frm" method="post" action="/znlykjdxswxy/Logon.do?method=logon" onsubmit="return onSubmint();">									
        <div class="wapbg">
        <div class="wap">
        <div class="top">
            <img style="padding-top:80px" src="./学校logo.png" width="474px" height="51px">
        </div>
        <div class="middle">
            <img src="./学校二维码.png" alt="" width="428px" height="248px">
        <div class="dl"> 
             
                <div class="logintitle">用户登录</div>
            
            
            <div class="dl_hidden dl_box1">
                
                <table border="0" width="320px">
                    <tbody><tr>
                        <td class="trclass">用户名:</td>
                        <td>
                            <input type="text" id="userAccount" maxlength="32" value="" style=" width:250px;" class="input">
                            <input type="hidden" id="view" name="view" value="1">
                        </td>
                    </tr>
            
                    <tr>
                        <td class="trclass">密码:</td>
                        <td>
                            <input type="password" id="userPassword" value="" maxlength="32" style="width:250px;" class="input"> 
                            <input name="useDogCode" id="useDogCode" type="hidden">
                            <input name="encoded" id="encoded" type="hidden">
                        </td>
                    </tr>
                    
                    
                    <tr>
                        <td class="trclass">验证码:</td>
                        <td style>
                            <input type="text" name="RANDOMCODE" id="RANDOMCODE" maxlength="6" class="input" style="width:70px;display:block;float: left;">
                            <img src="./验证码.png" id="SafeCodeImg" onclick="ReShowCode()" width="65" height="28px" style="display:block;float: right;padding-right:100px;"> 
                        </td>
                    </tr>
                    
                    
                    <tr>
                        <td colspan="2" align="right" style="padding-top: 10px;">
                            <input type="submit" id="btnSubmit" class="button" title="点击登录" value="登  录">
                        </td>
                    </tr>
                </tbody></table>
                <font color="red">验证码无效,请重新登录!</font> 
            </div>
            
            <div class="dl_hidden dl_box2" style="display:none">
                <div>
                    <a href="http://www.qzdatasoft.com/qqjw/login4qq.do?method=loginIndex">
                        <img src="/znlykjdxswxy/framework/images/new/qqdl.gif" style="border:0px;">	
                    </a>
                </div>
            </div> 
            
        </div>
    
        <div class="end" style="display: block;">
            <table border="0" width="100%">
            <tbody><tr>
            <td align="left"><a target="_blank" href="http://www.qzdatasoft.com" class="copyright" title="湖南强智科技发展有限公司">湖南强智科技发展有限公司</a>版权所有  <!-- @2000-2013 -->
            
            
            
            </td>
            <td align="right"><a href="#" class="copyright">在线用户数:0人</a></td>
            </tr>
            </tbody></table>
        </div>
    </div>
    </div>
    </div>
    </form>
</body>
</html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值