我开始使用一些引导 4 演示主题。
当我创建链接以转到同一页面的某些部分时 - 它们有点太远了，我丢失了该div 的第一行，所以我必须向后滚动一点才能看到开头。在此示例中 - 它可能从"content3"左右开始。
似乎有某种偏移可能正在这样做？我不知道在哪里可以找到它。
任何想法如何调整它以不超过div的开头？
<a href="#here1" >MY INFO goooo</a>
<div id="here1" class="container text-center">
content1<br>
content2<br>
content3<br>
content4 etc....<br>
</div>
谢谢 - 戴夫
如果您的网站有一个固定的标题，您可能已经注意到锚标签链接不能完美地工作——当用户使用锚链接时，锚点的位置隐藏在固定标题后面，隐藏了内容的第一部分。
此方法不涉及任何 JavaScript，也不需要更改主题或内容。
在您的 HTML 中：
<a class="anchor" id="top"></a>
若要解决此问题，可以将以下内容添加到 CSS 样式表中。
这是我应用的一个修复程序：
对于您的 CSS：
a.anchor {
display: block;
position: relative;
top: -250px;
visibility: hidden;
}
这是另一种方法：
:target:before {
content:"";
display:block;
height:90px; /* fixed header height*/
margin:-90px 0 0; /* negative fixed header height */
}
注意：90px 是固定标题的高度加上边距和填充。您需要将其调整为固定标头的大小。
缺点是它需要浏览器对伪元素的支持，如果目标元素具有背景颜色、重复的背景图像、顶部填充或顶部边框作为其规则集的一部分，它将失败。
在此处了解更多方法及其优缺点：跳转链接和视口定位
此解决方案使用 JS：
var shiftWindow = function() { scrollBy(0, -50) };
if (location.hash) shiftWindow();
window.addEventListener("hashchange", shiftWindow);
您可以在此处阅读有关其他用户解决方案的更多信息。
function scrollToDiv(divID){
$('html, body').animate({
scrollTop: $('#' + divID).offset().top - 50
}, 1000);
}