0

是否可以使用引导程序创建导航栏，我不导航到同一 html 页面中的选项卡，而是导航到不同的 html 页面？而且我也想保持淡入淡出的风格。

似乎应该是大页面的可能原因，将所有内容都放在同一个 html 页面中似乎是不切实际的。

<body class="page"> 
<div id="navigationbar">
    <ul class="nav nav-pills centerdiv span5">
      <li class="active"><a href="#main" data-toggle="tab">Main</a></li>
      <li><a href="#about" data-toggle="tab">About</a></li>
      <li><a href="#open" data-toggle="tab">Open</a></li>
      <li><a href="#contact" data-toggle="tab">Contact</a></li>
    </ul>
</div>

我怎样才能写出类似的东西

<body class="page"> 
<div id="navigationbar">
    <ul class="nav nav-pills centerdiv span5">
      <li class="active"><a href="main.html">Main</a></li>
      <li><a href="about.html">About</a></li>
      <li><a href="open.html">Open</a></li>
      <li><a href="contact.html">Contact</a></li>
    </ul>
</div>

目标是包含在带有类淡入淡出的标签中的第一种样式，但是如果我将目标分隔在不同的页面中，这将不起作用。

4

1 回答 1

0

您可以简单地class="active"在各自的文件中设置导航栏链接。

如果你有很多页面，在每个页面中都有导航可能会很痛苦，因为如果你把它放在一个地方，你必须在每个地方都改变它。您可以将导航栏移动到单独的文件中并执行一些脚本。例如，在 PHP 中，您将拥有如下内容：

<li<?php active('main.html'); ?>><a href="main.html">Main</a></li>

你需要一些这样的功能：

function active($file) {
    if($_SERVER['REQUEST_URI'] == '/'.$file) {
        echo ' class="active';
    }
}

请注意，这过于简单化了。您需要删除查询字符串，如果文件不在域的根目录中，这也不起作用。

您可以将菜单插入到这样的页面中

<?php include __DIR__.'/navigation.php'; ?>

您还可以使用一些模板系统使其更简单。Jekyll对你来说可能很有趣。

示例菜单：https ://github.com/rsms/rsms.github.com/blob/master/_layouts/default.html#L78

于 2013-07-21T12:08:15.113 回答