时间戳

首页 > 解决方案 > 无法将页面链接到同一页面中具有两个导航栏的其他页面

html - 无法将页面链接到同一页面中具有两个导航栏的其他页面

问题描述

任何人都可以帮助我吗？我在一个页面中有两个不同的导航栏，可以将该页面链接到另一个页面。但是其中两个位于不同的位置，一个在顶部，另一个在底部。

*对于底部，我只是将导航栏的编码替换为“b href”以表示临时性，并希望寻求您的解决方案”</p>

下面是我的编码：

在页面顶部（导航条编码）

  <label for="home" class="home"><a href=" "><i class="fas fa-home"></i>Home</a ></label>

  <label for="tours" class="tours"><a href="tours.html"><i class="fas fa-route"></i>Tours</a ></label>

  <label for="destination" class="destination"><a href="destination.html"><i class="fas fa-plane-arrival"></i>Destination</a ></label>

 <label for="aboutus" class="aboutus"><a href="aboutus.html"><i class="far fa-address-card"></i>About Us</a ></label>

 <label for="contact" class="contact"><a href="contact.html"><i class="far fa-envelope"></i>Contact</a ></label>

页面底部（导航条编码）（我知道没有任何名为“b href”的超链接，所以我只是临时替换了它

    <li><b href="#" class="homebottom">Home</b></li>
        <li><b href="destination.html">Destination</b></li>[enter image description here][1]
        <li><b href="tours.html">Tours</b></li>
        <li><b href="aboutus.html">About Us</b></li>
        <li><b href="contact.html">Contact</b></li>

    </ul>

结论：如何在不影响现有导航栏的情况下设置两个导航栏的样式？

底部导航栏

顶部导航栏

标签： htmlcss

解决方案

如果您id向唯一的导航元素添加 ，例如topNav和bottomNav。然后，您可以使用唯一 ID 来定位具有不同 css 的不同元素。

<ul id="topNav">
...
<ul id="bottomNav">

ul#topNav {}
ul#bottomNav {}

这种技术有时被称为伪命名空间。

推荐阅读