粘滞标题涵盖锚文本

时间:2012-05-18 21:46:31

标签: html css

我有一个粘贴的标题,浮动在页面的其余部分。当我链接到页面锚点时,当然是滚动,以便锚点位于页面的顶部。但是,当发生这种情况时,标题会覆盖下面的文本。

有没有办法解决这个问题?我不能只是将锚点向下移动,因为页面上有很多锚点,每个文本都有不同的文本。我的第一个是以某种方式滚动到锚点上方的某个高度。

谢谢, 大卫

2 个答案:

答案 0 :(得分:4)

:target伪元素可能就是你要找的东西。使用:target,您可以使用#-mark指出要指出的元素。详细了解here

答案 1 :(得分:0)

我遇到了同样的问题,最终制定了这样的规则:

A.named:target {
    display: inline-block;
    height: 120px;
    margin-top: -120px;
}

然后我应用了这个类"名为"到我希望浏览器滚动到的任何锚标记。这会在浏览器顶部和包含锚点的元素底部之间增加120px的空间 - 标题大约为80px,另外40px用于补偿我链接到的H2标题的高度......并且,负边距抵消了正面边距,它不会影响我的页面外观。

希望这有帮助!