在PHP“包含”文件未正确定位后添加的内容

Question

我正在使用PHP的“包含”功能在我的所有页面上显示静态元素，但最终结果并未按原样显示。

索引代码：

<?php 
    require '../../views/sidebar.php';
    require '../../views/navbar.php';
?>
<div class="card">
    <div class="card-header">
        Test
    </div>
    <div class="card-body">
        <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="#">Home</a></li>
        <li class="breadcrumb-item active" aria-current="page">Library</li>
        </ol>
        </nav>
        <p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
        <a href="#" class="btn btn-primary">Go somewhere</a>
    </div>
</div>

侧边栏代码：

<nav class="side-navbar">
  <div class="side-navbar-wrapper">
    <div class="sidenav-header d-flex align-items-center justify-content-center">
      <div class="sidenav-header-inner text-center"><img src="../../views/img/logo.jpg" alt="menulogo" class="img-fluid rounded-circle">
        <h2 class="h5">Test</h2><span>Dashboard</span>
      </div>
      <div class="sidenav-header-logo"><a href="index.html" class="brand-small text-center"> <strong>B</strong><strong class="text-primary">D</strong></a></div>
    </div>
    <div class="main-menu">
      <h5 class="sidenav-heading">Main</h5>
      <ul id="side-main-menu" class="side-menu list-unstyled">                  
        <li><a href="index.html"> <i class="icon-home"></i>Home                             </a></li>
        <li><a href="forms.html"> <i class="icon-form"></i>Forms                             </a></li>
        <li><a href="charts.html"> <i class="fa fa-bar-chart"></i>Charts                             </a></li>
        <li><a href="tables.html"> <i class="icon-grid"></i>Tables                             </a></li>
        <li><a href="#exampledropdownDropdown" aria-expanded="false" data-toggle="collapse"> <i class="icon-interface-windows"></i>Example dropdown </a>
          <ul id="exampledropdownDropdown" class="collapse list-unstyled ">
            <li><a href="#">Page</a></li>
            <li><a href="#">Page</a></li>
            <li><a href="#">Page</a></li>
          </ul>
        </li>
        <li><a href="login.html"> <i class="icon-interface-windows"></i>Login page</a></li>
        <li> <a href="#"> <i class="icon-mail"></i>Demo
        <div class="badge badge-warning">6 New</div></a></li>
      </ul>
    </div>
    <div class="admin-menu">
      <h5 class="sidenav-heading">Second menu</h5>
      <ul id="side-admin-menu" class="side-menu list-unstyled"> 
        <li> <a href="#"> <i class="icon-screen"> </i>Demo</a></li>
        <li> <a href="#"> <i class="icon-flask"> </i>Demo
            <div class="badge badge-info">Special</div></a></li>
        <li> <a href=""> <i class="icon-flask"> </i>Demo</a></li>
        <li> <a href=""> <i class="icon-picture"> </i>Demo</a></li>
      </ul>
    </div>
  </div>
</nav>

这是我用于学习目的的可引导模板的摘录，而css既是引导程序，也是模板的原始内容。