2

我是编程新手，所以这是我的基本问题。

我知道如何制作导航列表，但我不知道如何使其发挥作用。例如，假设我的导航列表有 3 个按钮：主页、关于和联系我。如何使我的网页在这 3 个按钮之间从主页内容更改？？？我的意思是当我点击关于或联系我按钮时如何获得不同的文本/内容？

希望你明白我的意思。一定很简单，但我只是一个初学者。

在此先感谢您的帮助！

4

3 回答 3

2

通常这些“按钮”是使用锚标签 ( )创建的链接。<a>要转到的页面由href标签上的属性给出，这是一个 URL。URL 可以是绝对的 ( http://stackoverflow.com) 或相对的 ( about.html)。

这是一个链接示例：

<a href="about.html">About</a>

当用户单击链接时，浏览器会查看该链接href并将用户带到该页面。

我建议您阅读许多“入门 HTML”书籍和/或网站中的任何一本，以获得更全面的解释。

如果出于某种原因您绝对想使用实际按钮（而不是样式看起来像按钮的链接），您可以这样做，但不建议这样做。这里有两种方法：

  1. 使按钮成为一个submit按钮，并以自己的形式放置每个按钮。按钮将用户带到的页面在action表单的属性中定义为 URL：

    <form action="about.html" method="GET">
    <input type="submit" value="About">
</form>

    或者

    <form action="about.html" method="GET">
    <button>About</button>
</form>

    （如果你使用<button>标签，你可以在按钮上有富文本。另外，由于 a 的默认类型<button>是submit，你不需要type="submit"它。）

  2. onclick在按钮上放置一个处理程序。我不推荐这个有几个原因，尤其是如果用户没有启用 JavaScript，它们就不起作用，但这种情况很少见。

    <input type="button" onclick="location = 'about.html'" value="About">

    或者

    <button type="button" onclick="location = 'about.html'">About</button>
于 2013-05-18T17:08:58.560 回答
1

大多数情况下也会使用 CSS。如果您希望它们都在列表中运行，您可以在 HTML 中使用以下内容：

<ul class="navmenu">
  <li><a href="index.html">Home</a></li>
  <li><a href="about.html">About</a></li>
  <li><a href="contact-me.html">Contact Me</a></li>
</ul>

您的 CSS 样式将是：

<style>
ul.navmenu {
/* enter your css UL MENU for your menu here*/
}
ul.navmenu li {
/* enter your css LIST for your menu here*/
}
ul.navmenu li a {
/* enter your css LINK for your menu here*/
}
</style>

您可以查找“CSS 列表样式”并获取有关如何更改其外观的更多信息。希望能帮助您入门。

要获取更改内容的按钮，您需要添加页面。例如，您将创建第一页 index.html（或 index.php，或其他页面类型）、about.html 和 contact-me.html。您必须创建这些页面，这样当您单击这些链接时，您的链接就会从一个页面转到下一个页面。

于 2013-05-18T17:17:39.290 回答
0

如果您是 Web 开发的新手，我建议您不要尝试从头开始构建像导航栏这样的通用组件。而是使用一个框架，例如Twitter Bootstrap。它有一个导航栏。

于 2013-05-18T17:09:55.243 回答