在 windicss 中，提供了媒体查询和 class 两种方式实现暗黑模式适配。而且比较省心的是——其提供的 dark 变体会自动根据选择的适配模式，生成对应的代码，可以有效避免写出一堆没用的css，看起来也比较清晰。 为了方便控制，我们选择使用 class 的方式来切换暗黑模式…

这是掘金网页版的头部，当滚动条向下滑动时，主header会隐藏，次级header会吸在页面顶部。 样式 首先，我们先通过两个 div 来模拟这两个header <template> <div class="main-header-wrapper"> <div class="main-header"></div> …