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">&nbsp;</td>
        <td>&nbsp;</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">&nbsp;</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);">前进</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>&nbsp;</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://www.php.cn" target="_blank">php.cn</a>)</span></div></td>
              <td width="9%">&nbsp;</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">当前登录用户：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.