css+table实现DIV居中_html/css_WEB-ITnose

< html xmlns = " http://www.w3.org/1999/xhtml " >
< head >
< title > css.table.centerMiddlePosition.html
< meta name = " generator " content = " editplus " />
< meta name = " keywords " content = " javascript dhtml dom " />
< meta name = " description " content = " I love web development. " />
< style type = " text/css " >
* { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; }
body { height: 100 % ; }
#divTest { background - color: #ffff00; border: 1px dotted red; width: 500px; height: 500px; }
.tbeFrame { border - collapse: collapse; border: 1px solid blue; width: 100 % ; height: 100 % ; }
.tbeFrame td { text - align: center; vertical - align: middle; }


< body >
< table class = " tbeFrame " cellpadding = " 0 " cellspacing = " 0 " >
< tr >
< td >
< div id = " divTest " >
< h3 >
利用 css + table 实现 Div 居中
< table class = " tbeFrame " cellpadding = " 0 " cellspacing = " 0 " >
< tr >
< td >
< table cellpadding = " 0 " cellspacing = " 0 " border = " 0 " style = " background-color: #8888ff;
width: 250px; height: 100px; " >
< tr >
< td align = " right " >
用户名：

< td >
< input id = " tbxUn " type = " text " />


< tr >
< td align = " right " >
密码：

< td >
< input id = " tbxPw " type = " password " />


< tr >
< td align = " right " colspan = " 2 " >
< input id = " Button1 " type = " button " value = " button " />
< input id = " Button2 " type = " button " value = " button " />