使用a链接平滑滚动到页面某一元素位置

效果：

代码：

<div class="box">
    <div class="top">
      <div><a href="#content_1">1</a></div>
      <div><a href="#content_2">2</a> </div>
      <div><a href="#content_3">3</a> </div>
    </div>
    <div class="content">
      <div id="content_1">内容1</div>
      <div id="content_2">内容2</div>
      <div id="content_3">内容3</div>
    </div>
  </div>

.content{
  scroll-behavior: smooth; //设置平滑滚动
}