HTML中实现table垂直居中

html中是没办法实现上下居中的，如果设置上下居中，需要通过js程序来设置。

方法一：在外面嵌套一层table，用table中的td来控制居中

<form id="form1" method="post">
        <table border=0 cellpadding=0 cellspacing=0 style="width:100% ;height:100%">
            <tr>
                <td style="width:100%;" align="center" valign="middle">
                    <table style="background-color:lightskyblue; margin:auto">
                        <tr>
                            <td></td>
                            <td align="center"> 用户登录 </td>
                            <td></td>
                        </tr>
                    </table>
                </td>
      </tr>
        </table>
    </form>

方法二：

table {
    width: 600px; height: 400px;//可随意
    position: absolute; left: 0; top: 0; right: 0; bottom: 0;
    margin: auto;    /* 有了这个就自动居中了 */
}

方法三：

 table{
	margin:0px auto;   
	width:300px;   
    	height:200px; 
    	position:absolute;
    	top:50%;
    	left: 50%;
    	margin-left: -150px;
    	margin-top: -100px;
 }

left：50%是元素最左边（左上角）和中线重合的地方，这个时候是不居中的，需要减去该元素的宽度一半，即margin-left等于负的宽度的一半

来源：CSDN

作者：Kadima丶

链接：https://blog.csdn.net/qq_35452961/article/details/78373203