使用引导选项卡时如何使锚链接跳转到内容

Question

我正在使用引导标签，并且想要创建并锚定链接，这会导致页面在我单击选项卡时立即向下滚动到内容区域。您无法在桌面上看到需要锚点，但对于移动设备（请参阅附件），用户必须向下滚动才能看到内容。因此需要一个锚链接。

标记：

<div class="collapse in" id="collapse1">
    <ul class="features nav nav-pills nav-stacked" role="tablist">
        <li role="presentation">  <!-- feature tab menu #1 -->
            <a href="#overview" aria-controls="f1" role="tab" data-toggle="tab" >
                overview
            </a>
        </li>
        <li role="presentation"> <!-- feature tab menu #2 -->
            <a href="#history" aria-controls="f2" role="tab" data-toggle="tab">
                history
            </a>
        </li>
        <li role="presentation"> <!-- feature tab menu #3 -->
            <a href="#mission" aria-controls="f3" role="tab" data-toggle="tab">
                mission & vision
            </a>
        </li>
        <!--
        <li role="presentation"> 
             <a href="#vision" aria-controls="f4" role="tab" data-toggle="tab">
                 vision
             </a>
        </li>
        -->
        <li role="presentation"> <!-- feature tab menu #5 -->
             <a href="#values" aria-controls="f5" role="tab" data-toggle="tab">
                 values
             </a>
        </li>
    </ul>
</div>

<!-- overview content open -->
<div role="tabpanel" class="tab-pane fade in active about-heading" id="overview">
    <!-- i want to set an anchor here --></a> <h4>overview</h4>
    <?php echo $content; ?>
</div>