[CSS] HTML固定頭部擋到錨點 – Anchor Hashtag is blocked by Fixed Header/Navbar

問題情境

在做網址#帶入 Anchor name 自動捲動至錨點時,網頁錨點捲動是以Anchor物件做TOP定位點,可能會被 Fixed Header/Navbar 擋到。


解決方法

使用CSS隱藏對上間距:

HTML:

<a class="anchor" id="top"></a>

CSS:

a.anchor {
    display: block;
    position: relative;
    top: -250px;
    visibility: hidden;
}

Referring StackOverFlow

Leave a Reply

Your email address will not be published. Required fields are marked *