如何平滑捲動到HTML中的特定元素？

如何使用HTML 捲動到特定元素

在HTML 中，您可以利用錨點() 元素直接連結到頁面上的特定元素。透過使用此方法，當使用者點擊錨連結時，瀏覽器將自動捲動到目標元素。

要實現此目的，只需在您希望使用者點擊的位置放置一個錨 () 元素即可，並將「id」屬性指派給要捲動到的元素。例如：

<a href="https://www.php.cn/link/c9da108374dde45533baccabee5beb23"></a>

<div>
<p>當使用者點擊'href="https://www.php.cn/link/c9da108374dde45533baccabee5beb23"'的錨連結時，瀏覽器會將頁面向下捲動到帶有「 id=”google“”的元素。然而，這種技術通常會導致突然的滾動行為。 </p>
<p>要實現更平滑的滾動效果，您可以在CSS 中包含以下程式碼：</p>
<pre class="brush:php;toolbar:false">html {
  scroll-behavior: smooth;
}

透過合併此CSS，錨連結和目標元素之間的滾動動畫將更加流暢，為使用者提供更具視覺吸引力的體驗。