使用PHP include引入多个页面时如何实现指定布局结构？

你的问题本质是页面布局属于CSS的能力范围，PHP的include仅负责将对应文件的代码拼接至当前位置，本身不提供布局控制能力，同时你的现有代码存在两处基础语法错误需要先修复：

1. <html" 标签多写了多余的双引号，会导致HTML解析异常
2. 侧边栏、主内容的引入代码写在了</body>闭合标签外，不会被正常识别为页面内容

修正后的完整代码 #

<?php
   include('session.php');
?>
<html>
   <head>
      <title>My catalogue</title>
      <style>
        /* 全局样式重置，可根据需要调整 */
        * {
          margin: 0;
          padding: 0;
          box-sizing: border-box;
        }
        /* 头部样式 */
        .header {
          padding: 16px;
          border-bottom: 1px solid #eee;
        }
        /* 布局容器，控制子元素横向排列 */
        .layout-container {
          display: flex;
          width: 100%;
        }
        /* 侧边栏样式，固定宽度居左 */
        .sidebar {
          width: 280px; /* 可自定义侧边栏宽度 */
          padding: 16px;
          border-right: 1px solid #eee;
          min-height: calc(100vh - 65px); /* 撑满剩余视口高度 */
        }
        /* 主内容区样式，占剩余宽度 */
        .main-content {
          flex: 1;
          padding: 16px;
        }
      </style>
   </head>
   <body>
      <div class="header">
        <h2><a href = "logout.php">Sign Out</a></h2>
      </div>
      <div class="layout-container">
        <!-- 左侧侧边栏 -->
        <div class="sidebar">
          <?php include("sidelist.php"); ?>
        </div>
        <!-- 右侧主内容 -->
        <div class="main-content">
          <?php include("page.php"); ?>
        </div>
      </div>
   </body>
</html>

代码说明 #

• 采用Flex布局实现左右分栏，兼容性覆盖绝大多数现代浏览器
• 你可以自行修改CSS中的宽度、边距、边框、背景等属性，匹配你想要的视觉效果
• 如果你的sidelist.php、page.php文件中已经有外层包裹标签，只需对应调整类名或者删除本代码中额外加的外层容器即可

内容的提问来源于stack exchange，提问作者John V