Mise en page du forum de discussion développée en PHP

Dans le chapitre précédent, nous avons déjà mentionné que la publication et l'affichage des messages utilisent une seule page, vous pouvez donc utiliser les connaissances HTML et CSS que vous avez acquises pour créer une mise en page simple. La mise en page utilisée dans le forum de discussion. ce tutoriel Le code est le suivant

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>留言板</title>
<body>
<div id="left">
    <img src="images/reg.jpg">
</div>
<div id="center">
    <h1>留言内容</h1>
</div>
<div id="right" >
    <h2>留言板</h2>
    <div > <a href="">首页</a> | <button>留言</button> <a href="" class="right">管理员登录</a>
        <form method="post" action="ressage_post.php" style="display:none;" onsubmit="return foo();" name="myform" ">
        <div class="form">
            <p>
                姓名:<input type="text" name="name">
            </p>
            <p>
                邮箱:<input type="email" name="email">
            </p>
            <p>
                留言内容:<br/>
                <textarea cols="30" rows="7" name="content"></textarea>
            </p>
            <p>
                验证码:<input type="text" name="vcode"><img src="yanzhengma.php" onClick="this.src='yanzhengma.php?nocache='+Math.random()" style="cursor:hand">
            </p>
            <p>
                <button class="button">提交留言</button>
            </p>
        </div>
        </form>
    </div>
</body>
</html>

Dans le code ci-dessus, nous divisons la page en trois parties, et une image est placée dans la première <div id="left">. L'image est la suivante

reg.jpg

Le deuxième<div id="center"> contient les messages que nous publions et affichons

Le troisième<div id= "right" >Nous avons placé le formulaire <form> à l'intérieur pour soumettre notre message


Nous n'avons utilisé aucun style CSS pour le code ci-dessus, donc notre page a l'air très moche. dans le prochain chapitre, nous vous montrerons le style de mise en page que nous avons utilisé



Formation continue
||
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>留言板</title> <body> <div id="left"> <img src="https://img.php.cn//upload/image/460/147/285/1477727203382106.jpg"> </div> <div id="center"> <h1>留言内容</h1> </div> <div id="right" > <h2>留言板</h2> <div > <a href="">首页</a> | <button>留言</button> <a href="" class="right">管理员登录</a> <form method="post" action="ressage_post.php" style="display:none;" onsubmit="return foo();" name="myform" "> <div class="form"> <p> 姓名:<input type="text" name="name"> </p> <p> 邮箱:<input type="email" name="email"> </p> <p> 留言内容:<br/> <textarea cols="30" rows="7" name="content"></textarea> </p> <p> 验证码:<input type="text" name="vcode"><img src="yanzhengma.php" onClick="this.src='yanzhengma.php?nocache='+Math.random()" style="cursor:hand"> </p> <p> <button class="button">提交留言</button> </p> </div> </form> </div> </body> </html>
soumettreRéinitialiser le code
  • Recommandations de cours
  • Téléchargement du didacticiel
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!