PHP develops simple book background management system top page
The book backend management system requires different pages to display different functional effects
Finally, these pages are assembled to form a complete backend function page.
In this section we will create the header page of the backend management system
As shown in the figure, it includes the administrator's password modification, user information, and exit This system
displays the homepage, page forward, backward, refresh, help, etc. Click the buttons
Use the <table> tag and <tr><td> for layout.
Add various small icons. to achieve the effect.
The layout is divided into 3<table>paragraphs
The first part is to change the password, user information and exit the system
<tr> <td height="57" background="https://img.php.cn/upload/course/000/000/008/58241d480ee8f976.gif"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="378" height="57" background="https://img.php.cn/upload/course/000/000/008/58242a6c7fb76454.jpg"> </td> <td> </td> <td width="281" valign="bottom"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="33" height="27"><img src="https://img.php.cn/upload/course/000/000/008/58241db991188465.gif" width="33" height="27" /></td> <td width="248" background="https://img.php.cn/upload/course/000/000/008/58241ecee3d8a379.gif"> <table width="225" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td height="17"><div align="right"><a href="ly_pwd.php" target="rightFrame"> <img src="https://img.php.cn/upload/course/000/000/008/58241f589c539785.gif" width="69" height="17" border="0" /></a></div> </td> <td><div align="right"><a href="ly_pwd.php" target="rightFrame"> <img src="https://img.php.cn/upload/course/000/000/008/58241f87de0d6838.gif" width="69" height="17" border="0" /></a></div> </td> <td><div align="right"><a href="login.php?tj=out" target="_parent"> <img src="https://img.php.cn/upload/course/000/000/008/58241fa5c3ae2298.gif" alt=" " width="69" height="17" border="0" /> </a></div> </td> </tr> </table></td> </tr> </table> </td> </tr> </table> </td> </tr>
The second part is the home page, forward and back , refresh, help, etc. click the buttons.
<tr> <td height="40" background="https://img.php.cn/upload/course/000/000/008/58241fee34c77371.gif"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="194" height="40" background="https://img.php.cn/upload/course/000/000/008/5824202426789223.gif"> </td> <td><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="21"><img src="https://img.php.cn/upload/course/000/000/008/5824204770d92615.gif" width="19" height="14" /></td> <td width="35" class="STYLE7"><div align="center"><a href="ly_right.php" target="rightFrame">首頁</a></div></td> <td width="21" class="STYLE7"><img src="https://img.php.cn/upload/course/000/000/008/5824206c3e017337.gif" width="19" height="14" /></td> <td width="35" class="STYLE7"><div align="center"><a href="javascript:history.go(-1);">后退</a></div></td> <td width="21" class="STYLE7"><img src="https://img.php.cn/upload/course/000/000/008/5824208561069957.gif" width="19" height="14" /></td> <td width="35" class="STYLE7"><div align="center"><a href="javascript:history.go(1);">前進(jìn)</a></div></td> <td width="21" class="STYLE7"><img src="https://img.php.cn/upload/course/000/000/008/582420b4a0ac0424.gif" width="19" height="14" /></td> <td width="35" class="STYLE7"><div align="center"><a href="javascript:window.parent.location.reload();">刷新</a></div></td> <td width="21" class="STYLE7"><img src="https://img.php.cn/upload/course/000/000/008/582420cfd7041136.gif" width="19" height="14" /></td> <td width="35" class="STYLE7"><div align="center"><a href="ly_right.php" target="rightFrame">幫助</a></div></td> <td> </td> </tr> </table></td> <td width="248" background="https://img.php.cn/upload/course/000/000/008/5824211aae974497.gif"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="16%"><span class="STYLE5"></span></td> <td width="75%"><div align="center"><span class="STYLE7">By(<a href="http://miracleart.cn" target="_blank">php.cn</a>)</span></div></td> <td width="9%"> </td> </tr> </table> </td> </tr> </table> </td> </tr>
The third part is the management menu display
<tr> <td height="30" background="https://img.php.cn/upload/course/000/000/008/5824213c382a3310.gif"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="8" height="30"><img src="https://img.php.cn/upload/course/000/000/008/5824215c09227277.gif" width="8" height="30" /></td> <td width="35%" background="https://img.php.cn/upload/course/000/000/008/5824217ae53db193.gif"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="24%"> </td> <td width="53%" height="20" valign="bottom" class="STYLE1">管理菜單</td> <td width="33%"> </td> </tr> </table> </td> <td><img src="https://img.php.cn/upload/course/000/000/008/58242199adc1e244.gif" height="30" /></td> <td><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" valign="bottom"><span class="STYLE1">當(dāng)前登錄用戶：admin 用戶角色：管理員</span></td> <td valign="bottom" class="STYLE1"><div align="right"></div></td> </tr> </table> </td> <td width="17"><img src="https://img.php.cn/upload/course/000/000/008/582421be84fc5175.gif" width="17" height="30" /></td> </tr> </table></td> </tr>
In this way, we have completed the front-end code of the background management header page.
