Blogger Information
Blog 145
fans 7
comment 7
visits 164170
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
初识PHP:利用php写一个动态的网站页面案例
李东亚¹⁸⁰³⁹⁵⁴⁰¹²⁰
Original
3653 people have browsed it

.web页面静态页面和动态页面的区别

  • 静态网页:
    • 静态网页的内容du相对稳定,因zhi此容易被搜索引擎dao检索;
  • 动态网页:
    • 动态网页以数据库技术为基础,可以大大减少降低网站维护的工作量;
    • 采用动态网页技术的网站可以实现更多的功能,如用户注册、用户登录、在线调查、用户管理、订单管理等等;

动态的网站页面案例

1.网站信息配置

  1. <?php
  2. $sitename="种业圈影视";
  3. $keyword="种业圈,种业圈影视,种业影视";
  4. $dsc="种业圈为你提供种业相关视频以及娱乐视频";
  5. $navs=["国内好剧","欧美大片","日韩动作片","港台电影"];
  6. $chinamovies=["紧急公关","有翡","三十而已","趁我们还年轻","幕后之王"];

2.网站页面
1)网站页面头部

  1. <?php require "config.php"?>
  2. <!DOCTYPE html>
  3. <html lang="en">
  4. <head>
  5. <meta charset="UTF-8">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <meta name="keywords" content="<?= $keyword?>">
  8. <meta name="description" content="<?= $dsc?>">
  9. <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
  10. <title><?= $sitename; ?></title>
  11. <link rel="stylesheet" href="style.css">
  12. </head>
  13. <body>
  14. <header>
  15. <nav>
  16. <div><a href="">首页</a></div>
  17. <?php foreach($navs as $nav): ?>
  18. <div><a href=""><?=$nav ?></a></div>
  19. <?php endforeach ?>
  20. <div><a href="">关于我们</a></div>
  21. </nav>
  22. </header>

2)页面内容

  1. <?php require "header.php"?>
  2. <main>
  3. <h2><?= $navs[0] ?></h2>
  4. <ul>
  5. <?php foreach($chinamovies as $movie ):?>
  6. <li><?=$movie?></li>
  7. <?php endforeach ?>
  8. </ul>
  9. </main>
  10. <?php require "footer.php"?>

3)网页底部

  1. <footer>
  2. <div>Copyright © 2020 种业圈 All rights reserved.备案信息</div>
  3. </footer>
  4. </body>
  5. </html>

4)页面的样式配置css

  1. * {
  2. margin: 0;
  3. padding: 0;
  4. box-sizing: border-box;
  5. }
  6. a {
  7. text-decoration: none;
  8. }
  9. header>nav {
  10. display: flex;
  11. background-color: brown;
  12. height: 48px;
  13. align-items: center;
  14. justify-content: space-evenly;
  15. padding: 0 10%;
  16. }
  17. header>nav>div {
  18. line-height: 48px;
  19. height: 48px;
  20. }
  21. header>nav>div>a {
  22. color: black;
  23. font-weight: bold;
  24. }
  25. header>nav>div>a:hover {
  26. color: white;
  27. }
  28. main {
  29. width: 1200px;
  30. min-height: 600px;
  31. background-color: #fff;
  32. margin: 0 auto;
  33. }
  34. footer {
  35. height: 40px;
  36. background-color: lightgray;
  37. color: black;
  38. display: flex;
  39. justify-content: center;
  40. align-items: center;
  41. }

5)页面效果

Correcting teacher:天蓬老师天蓬老师

Correction status:qualified

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post