网站后台管理界面的设计是要在数据库建好只好才能进行、、如果数据库还没建好的话,那连接部分先设置为空,页面转置方面也不能完成功能。今天工作完成得很早,就自己写了个代码,还有页面背景图片用了学习时候的一个例子,如果自己需要设置地有个性,可用自己网站的logo设置自己的风格
- <!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Transitional//ENhttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
- <htmlxmlns=http://www.w3.org/1999/xhtml>
- <head>
- <metahttp-equiv=Content-Typecontent=text/html;charset=gb2312/>
- <title>后台登陆界面</title>
- <styletype=text/css>
- <!--
- .work{
- font-size:32px;
- color:#FF6600;
- padding-top:180px;
- }
- body{
- background-color:#336699;
- }
- body{
- background-color:#CCCCFF;
- background-image:url(images/2.jpg);
- }
- .STYLE1{
- font-size:18px;
- font-weight:bold;
- }
- .form{
- padding-top:280px;
- padding-right:50px;
- padding-left:600px;
- }
- .STYLE2{color:#FFCCFF}
- -->
- </style>
- </head>
- <body>
- <formmethod=postaction=class=form>
- <tablewidth=280border=0align=center>
- <tr>
- <tdwidth=87align=centervalign=middlebackground=images/1.jpg><divalign=rightclass=STYLE1>
- <divalign=right>用户名:</div>
- </div></td>
- <tdwidth=183background=images/1.jpgbgcolor=#CCFFFF><spanclass=STYLE2>
- <label>
- <inputname=nametype=textid=namemaxlength=10/>
- </label>
- </span></td>
- </tr>
- <tr>
- <tdheight=37align=centervalign=middlebackground=images/1.jpg><divalign=right><spanclass=STYLE1>密码</span>:</div></td>
- <tdbackground=images/1.jpgbgcolor=#CCFFFF><spanclass=STYLE2>
- <label>
- <inputname=pwdtype=passwordid=pwdmaxlength=20/>
- </label>
- </span></td>
- </tr>
- <tr>
- <tdalign=centervalign=middlebackground=images/1.jpg><label>
- <divalign=center>
- <inputtype=submitname=Submitvalue=提交/>
- </div>
- </label></td>
- <tdbackground=images/1.jpgbgcolor=#CCFFFF><spanclass=STYLE2>
- <label>
- </span>
- <divalign=centerclass=STYLE2>
- <inputname=resettype=resetid=resetvalue=重置/>
- </div>
- <spanclass=STYLE2>
- </label>
- </span></td>
- </tr>
- </table>
- </form>
- </body>
- </html>
表单部分如果CSS+DIV熟练的话那就不要用table标记,table标记做的话可能代码量大,会影响速度。
下面的图片是上面代码运行之后的结果。