在我们发布此网站的 v17 设计（我们现在使用 v18）时。 我在 CSS 中添加了 html { scroll-behavior: smooth; }。 立即，我收到了 类似这样的 评论（仅举一例）
… 当您使用 control+f 或 command+f 在 CSS-Tricks 上搜索时，它会非常缓慢地滚动而不是跳到结果，这使得在 CSS-Tricks 上查找信息和关键字的速度大大降低。 作为经常使用此快捷方式的人，这对我的可用性来说是一个问题。
不久之后，我就将其删除了。 我对此并不十分在意，而且事实上您几乎无法控制它，这让我放弃了这个想法。
我经常看到它作为“CSS 提示”出现，所以我分享了我的经验
在提到这一点后，Christian Schaefer 给出了一个好主意
太棒了！
Christian 写了一篇博文
因此，平滑滚动会应用于所有内容。 始终如此。 即使是在循环浏览浏览器的页面搜索结果时也是如此。 至少在 Chromium 中是这样的。 因此，对于页面搜索，最好浏览器对此规则例外并停用平滑滚动。 在 Chromium 团队修复它之前，这里有一个技巧，说明如何使用一些额外的 CSS 和 HTML 自己解决此问题。
我不确定 Chrome（或任何其他浏览器）是否会将其视为错误。 我怀疑它是否已在规范中说明，因为页面查找并不是真正的 Web 技术功能。 但无论如何，我更喜欢没有它的页面查找。
html:focus-within {
scroll-behavior: smooth;
}它大部分情况下都有效。 但令人沮丧的是，会发生以下情况…
<a href="#link-down-the-page">Jump down</a>
...
<h2 id="link-down-the-page">Header</h2>这会将页面向下跳转。 使用 scroll-behavior: smooth;，这很好。 但 <h2> 通常不是“可聚焦”元素。 因此，使用上述技巧，现在 <html> 中不再有任何焦点，并且平滑滚动消失了。 如果您想保留它，则需要执行以下操作
<h2 tabindex="-1" id="link-down-the-page">Header</h2>
我认为我们不应该修改滚动行为。 有些人对平滑滚动很敏感，需要这些“步骤”。
感谢您的分享！ 以上仅供参考。 很棒的修复！
我突然想到，我们更新了平滑滚动代码段，以确保所有滚动到的标题也都是可聚焦的
在我们执行此操作时，由于某种程度上意想不到的可视焦点样式，它有点“有争议”。
集会不应该有争议。 当链接到锚点时，应该移动焦点，以便键盘用户也能使用。
始终将 tabindex="-1" 添加到正在链接到或通过编程方式接收焦点的非交互式元素。
我强烈建议只将该 tabindex 添加到 body 中。 它还允许 CSS 焦点目标在移动设备上很好地点击 body 中的任何其他内容。
不要忘记为那些喜欢减少运动的人禁用它 :)
有趣。 Firefox 没有这个问题。
平滑滚动对许多用户很有帮助。 特别是老年用户，当屏幕突然跳动时会感到困惑。
这会导致在 macOS 上使用 Firefox 的 select 元素出现问题。 您需要双击该元素才能查看选项。