CSS錨點定位時被頂部固定導航欄遮住

問題：使用錨點定位時，部分內容被頂部的固定導航欄遮住

錨點使用代碼示例如下：

<a href="#first">a</a>
<div id="first">
    hello
</div>

解決方法：

一、使用padding+margin

padding 影響錨點元素的定位，margin 不影響錨點元素的定位。所以使用 padding 調整錨點元素跳轉后的位置，再使用 margin 抵消 padding 對布局的影響。

#first {
    padding-top: 60px;/* 60px是導航欄高度 */
    margin-top: -60px;
 }

二、使用偽類:target

#first:target {
    padding-top: 60px;
    margin-top: -60px;
  }