基本語法

創(chuàng)建錨點(diǎn)

<a id="標(biāo)題一" class="anchor"></a>

創(chuàng)建跳轉(zhuǎn)連接 其中href 填寫錨點(diǎn)的id

<a href="rootUrl + '#標(biāo)題一'">到標(biāo)題</a>

存在問題

一般我們的錨點(diǎn)跳轉(zhuǎn)會(huì)直接將錨點(diǎn)置于視窗的最頂部，也就是說錨點(diǎn)的上頂點(diǎn)會(huì)與視窗頂部重合。如果這時(shí)候我們頂部有固定元素（比如導(dǎo)航之類的），錨點(diǎn)標(biāo)題就會(huì)被遮擋。
為了解決這問題，我們可以使用偽類befor來為錨點(diǎn)標(biāo)簽添加高度以消除固定元素的遮擋部分。

.anchor::before{
    display: block;
    height: 6rem;
    margin-top: -6rem;
    visibility: hidden;
    content: "";
}

具體在于使用margin-top:-6rem來消除高度 a 標(biāo)簽高度的增加對(duì)于布局的影響。一定要與height的值為相反數(shù)，這樣就不會(huì)影響之前的布局