HTML Anchor Position

大家好，我是奶綠。
HTML 原本就有提供 # 號 Anchor 功能，當 anchor 有對到 DOM id 時，就會跳到那個元素，不需要任何的 script 。

但他會定位到剛剛好的位置，如果此時有 fixed / sticky 的選單，就會被蓋掉。

這時可以在該元素新增 scroll-margin-to: 選單高度。

這就可以完美的定位在剛好的位置

Example Code:

JS Bin

Reference:
https://getpublii.com/blog/one-line-css-solution-to-prevent-anchor-links-from-scrolling-behind-a-sticky-header.html