使用HTML table标签可以使页面排列较为美观。
最简单的登录界面
<!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=gb2312" /> <title>用户登录</title> </head> <body> <form name="login" action="" method="post"> 用户名<input type="text" name="name"> <br /> 密码<input type="password" name="password"> <br /> <input type="submit" value="提交"> </form> </body> </html>
但是界面显示的时候，效果并不好，主要是对齐方式上。
修改后的代码：
<!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=gb2312" /> <title>用户登录</title> </head> <body> <form name="login" action="" method="post"> <table> <tr> <td>用户名:</td> <td><input type="text" name="name"></td> </tr> <tr> <td>密 码:</td> <td><input type="password" name="password"></td> </tr> <tr> <td>  </td> <td><input type="submit" value="提交"></td> </tr> </table> </form> </body> </html>