scrollintoView()实现锚点滚动功能时头部遮盖解决

1.问题描述：头部是一个高度为60px的锚点导航栏，因为要实现的一些效果导致中间滚动区域的margin-top不能设置值，但是scrollintoView()滚动时是以可视窗口最顶部为开始点，所以会导致头部导航栏遮盖的问题。

2.解决方法：使用css属性scroll-margin-top来解决。

css代码：

// css代码：对每一个锚点div设置 scroll-margin-top: 60px 即可
    const StyledLayout = styled.div`
    height: 100%;
    background: #f0f2f5;
    div.section {
    scroll-margin-top: 60px;
}
`;

js代码：

// js代码：正常使用 scrollIntoView({ behavior: 'smooth' }) 函数即可
const onActiveLinkChange = (index: number) => {
    const element = document.querySelector(`#${ANCHORS[index - 1].key}`);
    if (element) {
        element?.scrollIntoView({ behavior: 'smooth' });
    }
};