滚动元素设置 scroll-padding-top
<style>
html {
scroll-padding-top: 60px; /* 控制a标签锚点距离顶部距离 */
scroll-behavior: smooth; /* 平滑滚动 */
}
</style>
scroll-padding-top在ios(iphone12、iphone13)设置不生效!!或有兼容性问题。
解决方案:使用:target
伪类
#acne:target,
#blackhead:target,
#darkcircle:target,
#pore:target,
#coarseness:target {
padding-top: 50px; /* 50px为导航栏高度 */
margin-top: -50px;
}
兼容性如下