HTML作业3---教务系统页面

代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>教务系统页面</title>
    <style>
        .box-head,ox-foot{
            height:100px;
            width: 1000px;
            display: flex;
           color: rgb(225, 227, 228);
           margin-left: 200px;
           margin-top: 50px;
           margin-right: 200px;
           margin-bottom: 50px;
        }
        .box-head>img{
            width: 100px;
            height: 100px;
        }
        .alt{
            align-items: center;
          padding-top: 10px;
          color: rgb(237, 231, 231);

        }

        .box-body{
            display: flex;
            height: 500px;
           width: 1100px;
           background-color: aliceblue;
           float: left;
        }
        .a>img{
            height: 500px;
            width: 700px;
        }
        
        .b{
            background-color: rgba(238, 236, 233, 0.892);
            width: 70%;
            height: 500px;
            float: left;
        }
       .box-foot{
        height: 100px;
        width: 1000px;
        align-items: center;
       }
    </style>
</head>
<body>
    <div class="box-head">
        <img src="../../css/img/17209773_1.jpg" alt="">
        <div class="alt">延安大学教务管理信息服务平台</div>
    </div>
    <div class="box-body">
        <div class="a">
            <img src="../../css/img/dlycssz_cxDlycsszZp.html" alt="">
        </div>
        <div class="b">
            <h5 style="margin-bottom: 20px; padding-left: 15px;">用户登录</h5>
            <div class="userandpass">
                <table style="border-radius: 5px;border-color: rgb(164, 163, 163);
                background-color: rgb(255, 255, 255);"
                 border="1px">
                    <tr>
                        <td style="border: 0; width: 55px;">
                            <div style="margin-right: 5px;padding: 4px 12px 4px 15px;
                            border-right-style:groove; border-right-color: rgb(250, 248, 248);">
                                <img src="../5.css布局/联想截图_20240425205526.png">
                            </div>
                        </td>
                        <td style="border: 0;padding: 1px 3px 1px 3px;">
                            <div class="cart">
                                <input type="text" name="username" value="" placeholder="用户名"
                                style="width: 250px; height: 20px;border-width: 0;
                                background-color: rgb(255, 255, 255);">
                            </div>
                        </td>
                    </tr>
                </table>
                <table style="border-radius: 5px;border-color: rgb(164, 163, 163);
                margin-top: 10px; background-color: rgb(255, 255, 255);"
                border="1px" >
                    <tr>
                        <td style="border: 0; width: 55px;">
                            <div style="margin-right: 5px;padding: 4px 12px 4px 15px;
                            border-right-style:groove; border-right-color: rgb(250, 248, 248);">
                                <img src="../5.css布局/联想截图_20240425205538.png">
                            </div>
                        </td>
                        <td style="border: 0;padding: 1px 3px 1px 3px;">
                            <div class="cart">
                                <input type="password" name="password" value="" placeholder="密码"
                                style="width: 250px; height: 20px;border-width: 0;
                                background-color: rgb(255, 255, 255);">
                            </div>
                        </td>
                    </tr>
                </table>
                <div  class="cart" style="font-size: small; color: #337ab7;
                margin-left: 250px; margin-top: 15px;">
                <p style="width: 80px;">忘记密码了?</p>
                </div>
                <form action="http://jwglxt.yau.edu.cn/jwglxt/xtgl/login_slogin.html" method="post">
                <button type="submit" style="background-color: #337ab7;
                color: #fff;border-radius: 5px;width: 325px;height: 30px;
                border: 0;
                "value="登录"  class="cart">登录</button>
                </form>
                
                <div style="color: #a94442;background-color: #f2dede;border-color: ebccd1;
                font-size: small;padding: 15px;margin-top: 10px;
                border-radius: 5px;">
                    “圣地教务”公众号非任何学校官方公众号,请立即取消关注,谨防受骗或个人信息泄露
                    <br>
                    登录教务管理系统途径:
                    <br>
                    1.访问http://jwglxt.yau.edu.cn/jwglxt
                    <br>
                    2.登录学校网办大厅后选择教务系统登录
                    <br>
                </div>
                <div class="bjdl" style="margin-top: 30px;">
                    <img src="../5.css布局/联想截图_20240425205507.png" height="100px" alt="" style="float: left;
                    margin-right: 10px;">
                    <span style="color: #f3f1f1;font-size: small;">
                    <br>
                    用手机扫一扫,
                    <br>
                    安全、便捷登录
                    </span>
                </div>
            </div>
        </div>
     </div>


    <div class="box-foot" style="text-align: center; color: rgb(42, 121, 190); font: 10px microsoft YaHai;" ><p style="display: inline-block;margin-top: 10px;">版权所有:延安大学教务处 电话:0911-2650133 传真:0911-2650131 电子信箱:ydjwc@yau.edu.cn   版本V8.3.14</p></div>
    
</body>
</html>

结果

  • 4
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值