Header 擴展問題 HTML & CSS？

Question

我有一個 header 文件，其中包含導航菜單，我使用 function ( <?php include_once 'header.php'; ?> ) 將其包含在每個頁面上但奇怪的是，我在主頁（索引）以外的頁面上的“搜索”按鈕看起來不同（我的意思是 header.css 與某些元素一起工作）。 我將在下面附上主頁和注冊頁面的屏幕截圖，以便您了解我的意思。 另一個與“標題”相關的問題發生在我在索引頁面上添加標簽（以創建側邊菜單）時，它看起來像“標題”的 css，盡管“標題”有自己的 css 並且索引有另一個。 誰能告訴我為什么會這樣！ 顯然我還不能在這里添加圖片，但是如果你點擊下面的文件，它會打開，你會明白我的意思。 謝謝

索引頁面

<?php
  include_once 'header.php';
?>

<head>
  <title>{{ title }}</title>
  <link rel="stylesheet" href="static/index.css">
</head>
<body>
  <div class="category-tree">
    <h4 class="cat-title">Categories</h4>
    <nav>
      <ul class="left-menu-categories">
        <li class="cat-1"><a href="#" title="Estate">Title</a></li>
        <li class="cat-1"><a href="#" title="Estate">Title</a></li>
        <li class="cat-1"><a href="#" title="Estate">Title</a></li>
      </ul>
    </nav>
  </div>
</body>

Header文件

<?php
  session_start();
?>

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>PHP Project</title>
    <link rel="stylesheet" type="text/css" href="static/header.css">
  </head>
  <body>

    <nav>
      <img src="static/img/logo.png" href="index.php" style="width: 100px">
        <div class="wrapper">
            <ul>
          <div class="search-bar">
            <form>
              <input class="search-box" type="text" name="" placeholder="Search...">
              <button type="submit" class="button">Search</button>
            </form>
          </div>
          <?php
            if (isset($_SESSION["userid"])) {
              echo "<li><button class='sell' href=''>Button</button></li>";
              echo "<li><a href='profile.php'>My Profile</a></li>";
              echo "<li><a href='includes/logout.inc.php'>Log out</a></li>";
            }
            else {
              echo "<li><a href='signup.php'>Sign Up</a></li>";
              echo "<li><a href='login.php'>Login</a></li>";
            }
          ?>
            </ul>
        </div>
    </nav>
  </body>

<div class="wrapper">

主頁主頁

登錄頁面登錄頁面

Answer 1

PHP 是一種服務器端語言。 包含將文件服務器端解析為另一個文件，然后將其發送到用戶瀏覽器進行渲染。

所以你的文檔看起來像：

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>PHP Project</title>
    <link rel="stylesheet" type="text/css" href="static/header.css">
  </head>
  <body>

    <nav>
      <img src="static/img/logo.png" href="index.php" style="width: 100px">
        <div class="wrapper">
            <ul>
          <div class="search-bar">
            <form>
              <input class="search-box" type="text" name="" placeholder="Search...">
              <button type="submit" class="button">Search</button>
            </form>
          </div>
          <?php
            if (isset($_SESSION["userid"])) {
              echo "<li><button class='sell' href=''>Button</button></li>";
              echo "<li><a href='profile.php'>My Profile</a></li>";
              echo "<li><a href='includes/logout.inc.php'>Log out</a></li>";
            }
            else {
              echo "<li><a href='signup.php'>Sign Up</a></li>";
              echo "<li><a href='login.php'>Login</a></li>";
            }
          ?>
            </ul>
        </div>
    </nav>
  </body>

<div class="wrapper">

<head>
  <title>{{ title }}</title>
  <link rel="stylesheet" href="static/index.css">
</head>
<body>
  <div class="category-tree">
    <h4 class="cat-title">Categories</h4>
    <nav>
      <ul class="left-menu-categories">
        <li class="cat-1"><a href="#" title="Estate">Title</a></li>
        <li class="cat-1"><a href="#" title="Estate">Title</a></li>
        <li class="cat-1"><a href="#" title="Estate">Title</a></li>
      </ul>
    </nav>
  </div>
</body>

您肯定同意的是無效的 HTML 標記。 您有多重<head>和<body>部分。

您的實際文件應如下所示：

索引.php:

<?php
  include_once 'header.php';
?>

  <div class="category-tree">
    <h4 class="cat-title">Categories</h4>
    <nav>
      <ul class="left-menu-categories">
        <li class="cat-1"><a href="#" title="Estate">Title</a></li>
        <li class="cat-1"><a href="#" title="Estate">Title</a></li>
        <li class="cat-1"><a href="#" title="Estate">Title</a></li>
      </ul>
    </nav>
  </div>
</body>
</html>

header.php：



<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>PHP Project</title>
    <link rel="stylesheet" type="text/css" href="static/header.css">
  </head>
  <body>

    <nav>
      <img src="static/img/logo.png" href="index.php" style="width: 100px">
        <div class="wrapper">
            <ul>
          <div class="search-bar">
            <form>
              <input class="search-box" type="text" name="" placeholder="Search...">
              <button type="submit" class="button">Search</button>
            </form>
          </div>
          <?php
            if (isset($_SESSION["userid"])) {
              echo "<li><button class='sell' href=''>Button</button></li>";
              echo "<li><a href='profile.php'>My Profile</a></li>";
              echo "<li><a href='includes/logout.inc.php'>Log out</a></li>";
            }
            else {
              echo "<li><a href='signup.php'>Sign Up</a></li>";
              echo "<li><a href='login.php'>Login</a></li>";
            }
          ?>
            </ul>
        </div>
    </nav>

Header 擴展問題 HTML & CSS？

問題描述

1 個解決方案

解決方案1
0 2021-03-28 15:42:13

Header 擴展問題 HTML &amp; CSS？

問題描述

1 個解決方案

解決方案1 0 2021-03-28 15:42:13

Header 擴展問題 HTML & CSS？

解決方案1
0 2021-03-28 15:42:13