https://liquid-stack.pages.dev/zh/tags/%E8%87%AA%E5%AE%9A%E4%B9%89/Recent content in 自定义 on Liquid StackHugo -- gohugo.iozh-Hans我的博客Sat, 25 Jul 2026 00:00:00 +0000https://liquid-stack.pages.dev/zh/p/customizing-liquid-stack-styles/Sat, 25 Jul 2026 00:00:00 +0000https://liquid-stack.pages.dev/zh/p/customizing-liquid-stack-styles/<p>本指南介绍如何在不破坏主题升级与响应式布局的前提下，调整 Liquid Stack 的视觉风格。</p> <h2 id="从配置开始">从配置开始 </h2><p>先在 <code>hugo.yaml</code> 修改标题、侧栏简介、头像和颜色方案。内容层的改动应优先放在页面前置数据或 <code>data/</code> 文件中，而不是直接改主题源文件。</p> <h2 id="添加局部样式">添加局部样式 </h2><p>站点级样式位于 <code>assets/scss/custom.scss</code>。为新组件使用明确的类名，并避免覆盖通用 HTML 标签；这样可以减少对文章、菜单和移动端布局的连带影响。</p> <h2 id="每次改动都预览">每次改动都预览 </h2><p>每次修改颜色、间距或字体后，都检查首页、文章、相册、启动台以及深色模式。完成后运行完整 Hugo 构建，确保没有遗漏的资源或模板错误。</p>