包含在导航栏和垂直菜单之间

时间:2017-08-04 15:34:10

标签: php html css

我目前正在创建我的第一个网站,我有一些麻烦,我想在导航栏和垂直条之间包含一个页面,我想在点击我的垂直条的按钮时更改为页面。这是一个屏幕: Screen of my Website

这是我的代码:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Memeable | The 1# world meme generator</title>
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <link href="css/bootstrap-social.css" rel="stylesheet">
</head>
<body>
    <div >
    <?php
        include("head.php");
    ?>
    </div>

</body>

这是我的head.php:

<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
  <a class="navbar-brand" href="#">Memeable</a>
  <a href="http://www.facebook.com" class="fa fa-facebook "></a>
  <a href="http://www.twitter.com" class="fa fa-twitter "></a>
</div>
</div>
</nav>

<div class="vertical-menu">
  <a href="#" class="" id = "first">Premier</a>
  <a href="#" class = "">Deuxième</a>
  <a href="#" class = "">Troisième</a>
  <a href="#" class = "">Quatrième</a>
</div>

我确信解决方案很简单,但我不知道该怎么做。 谢谢你的帮助!

1 个答案:

答案 0 :(得分:0)

要在“内容区”中显示您的内容,请使用https://www.pdal.io/apps/diff.html。您提供要作为参数加载的文件名。使用数组指定要使用的所有有效文件,然后使用include参数选择要加载的正确子页面。

<?php
$files = array();
$files['home'] = 'home.php';
$files['contact'] = 'contact.php';
$files['whatever'] = 'you_want.php';
?>

然后在您希望显示内容的位置使用以下代码:

<?php
if (isset($_GET['nav'], $files[$_GET['nav']])) {
    include $files[$_GET['nav']];
} else {
    include $files['home']; // default page
}
?>

要“调用”正确的子页面,请将?nav=...查询参数添加到您的网址,例如

<ul>
    <li><a href="index.php?nav=home">Home</a></li>
    <li><a href="index.php?nav=contact">Contact</a></li>
</ul>