今天，我们在顶部菜单右侧添加了自定义暗色模式和主题选择器。
自动实现（prefers-color-scheme）已被基于[data-theme="dark"]选择器的管理所取代，当用户在浏览器中选择暗色主题时，就会显示该主题。有些浏览器，如 Opera，有一个"强制暗色模式"选项，可显示相当不错的暗色版本，但存在一些错误，如反转图片显示为负数，且无法进行任何配置。
我选择使用插入了GeneratePress 元素和 CSS 的 HTML 和 JS 长片段，并加上所有注释，这样就可以完整地列出已调整的内容，以备将来改进或更改，同时还可以完全控制样式的加载，使整个网站在视觉上保持绝对一致。
这些是与自动版本相比的主要改进：
- 渲染优化：通过统一的 CSS 样式层次结构消除闪烁和冲突，确保即时加载深色主题。
- 视觉一致性：精确调整动态元素（GenerateBlocks、Query Loops、tab 和 accordions）的颜色和滤镜，避免出现可读性问题（白底灰字）。
- 动态元素控制：纠正图像和菜单中的
混合滤镜（混合-混合模式）和不透明度，确保 Polylang 图标或文献页面上的卡片等元素在任何情况下都能保持正确的对比度。 - 技术清理：调试多余的选择器，统一 CSS 规则，以方便今后的维护，同时不影响性能和 CLS。
这也可以用插件来完成，但有逻辑上的限制，我决定用代码来完成，这样不仅可以省去一个插件，还可以对任何小细节进行细化控制和微调，并能对可能对加载速度产生的影响采取行动。
如果有人对代码感兴趣（这也没什么大不了的），只需吹一声口哨，我就会把它贴在这里。如果你也喜欢在黑网上冲浪，并发现了一些可以改进的地方，请随时留言或点击任何帖子底部的黄色 "报告错误 "按钮。
我还想提醒大家，我从事 WordPress 的优化工作，偶尔也会用GenerateBlocks 块对 GeneratePress 模板进行迁移和改编。
