腾讯小白作业之百度登录界面

最新推荐文章于 2023-01-02 21:42:00 发布

lmx_xss

最新推荐文章于 2023-01-02 21:42:00 发布

阅读量334

点赞数

本文链接：https://blog.csdn.net/lmx_xss/article/details/70495330

版权

<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8">
   <title>登录</title>
    <style type="text/css">
        *{
           margin:0;
           padding: 0;
        }
       .big{
           height: 281px;
           width: 391px;
           border: black 1px solid;
           box-shadow:2px 2px 10px #6789ad;
       }
       .big1{
           position: relative;
           height: 48px;
           width: 100%;
           background-color: rgb(247,247,247);
       }
       .zz{
           font-size: 20px;
           float: left;
       }
       .zzz{
           float:right;
       }
       .cc{
           float: left;
       }
       .duanxin{
           margin-right: 10px;
           float: right;
       }
       .ab{
           text-align: center;
           line-height: 20px;

       }
       .abc{
           line-height: 20px;
            margin-bottom: 10px;
       }
       .d{
           margin-left: 105px;
           margin-top: 0px;
       }
       .ss{
           float: right;
       }
       .asd{
           margin-left: 105px;

       }
       .aaa{
           width: 173px;
           background-color: rgb(63,144,247);
       }
    </style>
</head>
<body>
   <div class="big">
   <div class="big1">
   <img class="cc" src="bd.png"/>
   <p class="zz">百度登录账号</p>
   <p class="zzz">X</p>
   </div>
   <div class="duanxin"><a href="#">短信快捷登录</a></div><br>
   <div class="ab">
   <input type="text" class="abc" value="用户名"> <br/>
   <input type="passord" class="abc" value="密码"> <br/>
   </div>
   <div class="d">
    <input class="" type="radio" />下次自动登录
    <a class="ss" href="#">登录遇到问题</a>
   </div>
   <div class="asd"><input type="button" class="aaa" value="登录"></div>
   <div class="ss"><a href="#">立即注册</a></div>
   <br/><br><hr>
   可以使用以下方式登录
   <br>
   <img src="yj.png">
   </div>
</body>
</html>