欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

初识PHP:利用php写一个动态的网站页面案例

程序员文章站 2022-03-01 17:22:14
...

.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)页面效果
初识PHP:利用php写一个动态的网站页面案例