zoukankan      html  css  js  c++  java
  • 使用 dl 设计的简单的登陆界面 (为了记录)

    先贴图

    对应的地方放置 一些登陆的图片即可

    html 代码如下:

    <html>
    <head>
    <style>
    body {text-align:center;margin:0 auto;} // 进行居中出咯
    .info  dt {padding:0px; margin-left:0px; }     // 进行浏览器解析统一
    .info  dd { padding:0px; margin:0px; margin-top:2px; vertical-align:middle; margin-bottom:30px;}

    .info dd img { margin-top:2px;vertical-align:middle;30px;height:20px;}
    .info dd input { margin-top:2px;vertical-align:middle;} 进行大小以及水平居中设置
    .contrainer {text-align:left;  300px;height:auto;}
    .main { text-align:center;margin:0 auto;background-image:url("demo.png");300px;height:300px;}
    .info .btnok{text-align:center;193px;height:30px;}  登陆图片设置

    .info dd .ok{margin-left:-130px; } // 登陆文字的位置定位

    </style>
    </head>
    <body>
    <div class="main">

    <div class="contrainer">

    <dl class="info">
    <dt>
    user login Demo
    </dt>
    <dd>
    <span ><img src="" /> <input type="text" /> </span>
    </dd>
    <dd>
    <span ><img src="" /> <input type="text" /> </span>
    </dd>
    <dd>
    <span ><img class="btnok" src="" /> <span class="ok">login in </span> </span></dd>
    </dl>
    <div>
    </div>
    </body>

    </html>

    以上代码子IE 5. 以及IE 6 ,7 中测试通过

  • 相关阅读:
    重识linux-常见压缩和解压缩命令
    重识linux-压缩文件的原理
    重识linux-关于selinux
    重识linux-循环执行的例行性工作调度
    重识linux-仅执行一次的工作调动at
    Python资源
    python hehe
    Chrome 消息机制
    自己动手写reg注册表文件
    用JavaScript截图
  • 原文地址:https://www.cnblogs.com/rongfengliang/p/3727051.html
Copyright © 2011-2022 走看看