PHP développe une page d'accueil simple pour un système de gestion d'arrière-plan de livre

Le système de gestion backend du livre nécessite différentes pages pour afficher différents effets fonctionnels

Enfin, ces pages sont assemblées pour former une page de fonctions backend complète.

Dans cette section, nous allons créer la page d'accueil du système de gestion backend

Comme le montre la figure, elle comprend la modification du mot de passe de l'administrateur, les informations utilisateur , et quittez Ce système

affiche la page d'accueil, la page suivante, la page suivante, l'actualisation, l'aide, etc. Cliquez sur les boutons

Utiliser la balise <table> ; pour la mise en page.

Ajoutez diverses petites icônes. pour obtenir l'effet.

La mise en page est divisée en 3 paragraphes <table>

Le premier consiste à modifier le mot de passe, les informations utilisateur et à quitter le système

<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>

La deuxième partie est la page d'accueil, avancer et revenir, actualiser, aider, etc. cliquez sur les boutons.

<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>

La troisième partie est l'affichage du menu de gestion

<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>

De cette façon, nous avons complété le code front-end de la page d'en-tête de gestion en arrière-plan.