分享一下代码!

来源:4-1 编程挑战

大布and科比

2015-08-19 18:42

希望相互交流,看到不同的布局思路。

写回答 关注

1回答

  • 我不是小清丶
    2015-12-15 14:26:36

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>登录界面</title>

    <style type="text/css">

    * {

    margin: 0;

    padding: 0;

    }

    .box {

    width: 220px;

    height: 400px;

    background: #ebf2fa;

    }

    .login-form {

    padding: 15px;

    }

    .login-input {

    display: block;

    width: 188px;

    height: 32px;

    border: 1px solid #abd6c9;

    border-radius: 3px;

    text-indent: 30px;

    margin-top: 15px;

    font-size: 15px;

    }

    p {

    height: 13px;

    margin-top: 15px;

    }

    p a {

    font-size: 13px;

    text-decoration: none;

    float: right;

    }

    p lable {

    font-size: 13px;

    vertical-align: top;

    }

    .btn {

    width: 190px;

    height: 38px;

    margin-top: 15px;

    border: 0;

    background: url(http://img.mukewang.com/539a972b00013e9102280177.jpg) no-repeat;

    text-indent: -999em;

    cursor: pointer;

    }

    .btn2 {

    background-position: 0 -38px;

    }

    hr {

    margin-top: 20px;

    color:#CCC;

    }

    </style>

    </head>


    <body>

    <div class="box">

      <form class="login-form">

        <input class="login-input" type="text" placeholder="邮箱/手机号/用户名"/>

        <input class="login-input" type="password" placeholder="请输入密码"/>

        <p>

          <input id="autologin" type="checkbox" />

          <label for="autologin">下次自动登录</label>

          <a href="#">忘记密码?</a> </p>

        <input type="submit" class="btn" value="登录"/>

        <hr />

        <input type="button" class="btn btn2" value="注册"/>

      </form>

    </div>

    </body>

    </html>


CSS Sprite雪碧图应用

必学的大型网站实用技术,让你快速掌握CSS Sprite雪碧图技术

47092 学习 · 241 问题

查看课程

相似问题