本文介绍如何通过一个无渲染组件 HeroBG，为 vuepress-theme-hope 主题定制全屏 Hero、固定背景、自适应遮罩以及统一页脚样式，让博客首页更具沉浸感。

在搭建 undz.cn 的过程中，我希望博客首页能有一个沉浸式的Hero，并且导航栏在滚动时能够平滑过渡，同时在非首页时恢复正常的样式。本文将分享我实现这一效果的 TopNavBeautify 组件的设计思路与完整代码。