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