修復了標頭和跳躍鏈接？解決方案是滾動 - 邊緣頂

遇到一個令人沮喪的問題？跳躍鏈接，例如[Jump](#header-3) ，通向標題（例如### Header ）通常被頁面頂部的固定位置標頭遮蓋。這個常見的問題將目標標頭隱藏起來。

以前，解決此問題所需的繁瑣解決方法。即使在CSS漫步上，在網絡內標頭上的寬敞填充通常也是最簡單的解決方案。

幸運的是，現在存在一個簡單的CSS解決方案：

 H3 {
  滾動紋狀體頂：5REM; / *根據需要調整“ 5REM”以清除標頭 */
}

scroll-margin-top屬性優雅地將標頭向下推，以確保即使在上面有固定的標頭，也可以看到它。瀏覽器支持非常出色，這使得這是實用且廣泛兼容的解決方案。儘管經常與捲軸折斷一起討論，但它在這種情況下的效用可以說更為重要。

一個簡單的演示展示了其有效性。

有趣的是，Chrome的“文本片段”鏈接在提供不同的方法的同時，通常將用戶定位在頁面中間，為此常見問題提供了另一種解決方案。

以上是修復了標頭和跳躍鏈接？解決方案是滾動 - 邊緣頂的詳細內容。更多資訊請關注PHP中文網其他相關文章！