zoukankan      html  css  js  c++  java
  • DIV水平垂直布局

     1 <%@ page language="java"  pageEncoding="utf-8"  import="java.util.*,com.tao.pojo.*"%>
     2 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
     3 <html>
     4 <head>
     5 <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
     6 <title>Login</title>
     7     <style type="text/css">
     8         #mydiv{
     9             text-align:center;
    10             width: 660px;
    11             height: 880px;
    12             position: absolute;
    13             left: 50%;
    14             right: 50%;
    15             margin-left: -300px;
    16             margin-top: -140px;
    17             border: 1px;
    18             border:1px solid blue;   
    19             /* background-image: url("timg000.jpg"); */
    20             align-content: center;
    21         }
    22         #myform{
    23             border:1px solid red;
    24             width: 300px;
    25             height: 160px;
    26             position: relative;
    27             left:50%;
    28             top:50%;
    29             margin-left: -152px;
    30             margin-top: -80px
    31         }
    32     </style>
    33 </head>
    34 <body style="background-image: url('t01.jpg');">
    35     <div id="mydiv">
    36         <div id="myform">
    37         <!-- //这里的login是从servlet过来的 -->
    38             <form action="login" method="post">
    39             <table align="center">
    40             <!-- 用户名:aa,密码:aa -->
    41                 <tr>
    42                     <td >用户名:<input type="text" name="uname" > </td>  
    43                 </tr>
    44                 <tr>
    45                     <td >&nbsp;&nbsp; 码:<input type="password" name="upass"></td>
    46                 </tr>
    47                 <tr>
    48                     <td ><input type="submit" value="登录"></td>
    49                 </tr>
    50             </table>
    51             </form>
    52         </div>
    53     </div>
    54 </body>
    55 </html>

    下面是效果

  • 相关阅读:
    P2813 母舰
    P5367 【模板】康托展开
    P1816 忠诚
    P3865 【模板】ST表
    P1913 L国的战斗之伞兵
    P4939 Agent2
    P1894 [USACO4.2]完美的牛栏The Perfect Stall
    P5017 摆渡车
    P1330 封锁阳光大学
    P5018 对称二叉树
  • 原文地址:https://www.cnblogs.com/jili6254/p/8124615.html
Copyright © 2011-2022 走看看