Question

我是Stack Overflow的新手，所以如果这是一个重复的问题，请原谅我。我彻底搜查了，但无法弄明白。

我正在构建一个主要使用Bootstrap v3.3.6的zipline产品组合页面，并且无法让我的部分链接正确导航。

以下是我的标记样本，包括导航：

<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    </button>
        <a class="navbar-brand" href="#">Matthew Shelbourn</a>
    </div>
    <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav navbar-right">
            <li class="active"><a href="#bio">Bio</a></li>
            <li><a href="#projects">Projects</a></li>
            <li><a href="#gallery">Gallery</a></li>
            <li><a href="#contact">Contact</a></li>
        </ul>
    </div>
</div>
</div>

<!-- Body Section1 -->

<div>
<a name="bio"></a>
</div>

<div class="container" style="background-color:cadetblue;">
<div class="row">
    <div class="col-xs-12 col-md-4">
        <span><img id="profile-image" class="img-responsive pull-left" style="margin-top: 4.1%; margin-bottom:4.1%;" src="#"></span>
    </div>

点击导航栏中的链接＆＃34; Bio＆＃34; （或任何其他部分）它不会导航到相应部分的顶部。相反，它导航到距离该部分顶部约1/3的区域。

我的每个部分链接都会出现同样的问题。我确定它是微不足道的，但我做错了什么？谢谢！

HTML部分链接导航到错误的位置

0 个答案: