> ## Documentation Index
> Fetch the complete documentation index at: https://craft-support.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# 样式快速指南

> 全面指南，介绍如何在你的文档中自定义字体、颜色、背景、封面图片和装饰元素。

Craft 让您无需设计经验也能创建视觉出色的文档。样式功能允许您自定义背景、封面图片、文字颜色，甚至整个文档的颜色。和纸胶带分隔条为页面增添独特的装饰效果。

如需深入了解样式的工作原理，请从我们的文章 [文档、页面和块](/zh-Hans/introduction/documents) 开始。

## 样式菜单

<Tabs>
  <Tab title="macOS">
    在 macOS 应用中，在左侧 sidebar 找到 **样式** 选项卡：

    <img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/styles-sidebar.png?s=eeec64a237c912f088c787445755e7e1" alt="左侧 sidebar 中的样式菜单" width="800" height="685" data-path="images/write-and-edit/styling/quick-guide/en/content/styles-sidebar.png" />
  </Tab>

  <Tab title="Web">
    在 Web 应用中，在左侧 sidebar 找到 **样式** 选项卡：

    <img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/styles-sidebar.png?s=eeec64a237c912f088c787445755e7e1" alt="左侧 sidebar 中的样式菜单" width="800" height="685" data-path="images/write-and-edit/styling/quick-guide/en/content/styles-sidebar.png" />
  </Tab>
</Tabs>

## 样式预览与样式库

样式菜单会以简洁的预览展示您当前的字体、封面和背景设置 - 快速展示文档样式元素如何搭配。

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/style-preview-1.png?fit=max&auto=format&n=jHjNTJCRmpMXi5vN&q=85&s=0129a124f65d801c8869a4fe08b3c0ce" alt="样式预览示例 1" width="289" height="223" data-path="images/write-and-edit/styling/quick-guide/en/content/style-preview-1.png" />

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/style-preview-2.png?fit=max&auto=format&n=jHjNTJCRmpMXi5vN&q=85&s=8b9989c9e3feb864e536ec6dd41721be" alt="样式预览示例 2" width="283" height="217" data-path="images/write-and-edit/styling/quick-guide/en/content/style-preview-2.png" />

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/style-preview-3.png?fit=max&auto=format&n=jHjNTJCRmpMXi5vN&q=85&s=bae07e2a5e816779ece33c4a81a7f647" alt="样式预览示例 3" width="277" height="216" data-path="images/write-and-edit/styling/quick-guide/en/content/style-preview-3.png" />

单击 **样式预览** 以进入 **样式库**，浏览我们为文档精心挑选的预设样式集合。

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/styles-gallery.gif?s=62ec4bc1e0ad9fa6ddc9845ef44b59b7" alt="打开样式库" width="800" height="685" data-path="images/write-and-edit/styling/quick-guide/en/content/styles-gallery.gif" />

## 自定义样式

除了预设样式，您还可以为背景、文字和整个文档创建自定义颜色。

背景功能提供多种选项：

* **纯色** - 从色板中选择或创建自定义颜色
* **渐变** - 混合两种或多种颜色
* **图片** - 上传您自己的图片或从 Unsplash 中选择

<img src="https://mintcdn.com/craft-support/L5zMoIm2o8A5WVUD/images/write-and-edit/styling/quick-guide/en/content/custom-styling.gif?s=83ee42ce92078710e3acca683ec82ec0" alt="创建自定义样式" width="800" height="685" data-path="images/write-and-edit/styling/quick-guide/en/content/custom-styling.gif" />

## 上传自定义图片

您可以从设备上传任意图片作为背景或封面图片。

**针对背景：**

<Steps>
  <Step>
    在背景设置中选择 **图片** 选项
  </Step>

  <Step>
    选择 **上传** 并挑选您的图片
  </Step>
</Steps>

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/upload-backdrop.png?fit=max&auto=format&n=jHjNTJCRmpMXi5vN&q=85&s=37096d20142bf302b8b642af18df45ee" alt="上传背景图片选项" width="346" height="450" data-path="images/write-and-edit/styling/quick-guide/en/content/upload-backdrop.png" />

**针对封面图片：**

<Steps>
  <Step>
    单击封面图片区域
  </Step>

  <Step>
    选择 **插入文件** 并选取图片
  </Step>
</Steps>

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/upload-cover.png?fit=max&auto=format&n=jHjNTJCRmpMXi5vN&q=85&s=10c428878bdb58edca741dd229e34965" alt="上传封面图片选项" width="352" height="360" data-path="images/write-and-edit/styling/quick-guide/en/content/upload-cover.png" />

## Unsplash 集成

没时间自己搜索完美的封面或背景图片？Craft 与 Unsplash 的集成让您只需几次点击就能找到专业照片。

在设置背景或封面图片时，选择 **Unsplash** 按钮以访问 Unsplash 数据库。输入关键词搜索与主题匹配的图片。

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/unsplash-integration.gif?s=82de269fe5f0f12217c14201f88994a3" alt="在 Unsplash 中搜索图片" width="800" height="685" data-path="images/write-and-edit/styling/quick-guide/en/content/unsplash-integration.gif" />

## 分隔线与和纸胶带

分隔线有助于组织文档内容。Craft 将其扩展为和纸胶带 - 独特的装饰条，可作为视觉上的分隔。

可选项：

* **标准线条** - 经典分隔风格
* **和纸胶带** - 装饰性图案分隔条
* **涂鸦** - 手绘风格分隔条

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/separators.gif?s=72c338272195774355f463276a46264c" alt="不同的分隔样式" width="800" height="685" data-path="images/write-and-edit/styling/quick-guide/en/content/separators.gif" />

<Info title="小提示">
  输入三个短横 (`---`) 即可立即添加与当前文档设置的样式一致的分隔线。
</Info>

### 和纸胶带样式

与背景和封面图片选项类似，您可以为和纸胶带分隔条自定义纯色或图案。

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/washi-styling.gif?s=cc832858117b1aa2e4407cd3d0433971" alt="和纸胶带样式" width="800" height="685" data-path="images/write-and-edit/styling/quick-guide/en/content/washi-styling.gif" />

访问 **和纸胶带库** 寻找精美的预设图案：

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/washi-gallery.gif?s=8435350d7507d46cde5b5097bca4fb62" alt="浏览和纸胶带库" width="800" height="685" data-path="images/write-and-edit/styling/quick-guide/en/content/washi-gallery.gif" />

您可以非常精确地设置和纸胶带颜色。手动创建所需色调，或在取色器中输入 RGB 代码以获得精确颜色。

<img src="https://mintcdn.com/craft-support/L5zMoIm2o8A5WVUD/images/write-and-edit/styling/quick-guide/en/content/custom-color.gif?s=4a5d3a415f66b08b37a96623c5b50cb0" alt="创建自定义和纸胶带颜色" width="800" height="673" data-path="images/write-and-edit/styling/quick-guide/en/content/custom-color.gif" />

## 文本与文档颜色

Craft 文档默认使用 **系统默认** 颜色 - 在暗色模式下为黑色，浅色模式下为白色。颜色选择器中的黑白图标表示该选项。

<img src="https://mintcdn.com/craft-support/jHjNTJCRmpMXi5vN/images/write-and-edit/styling/quick-guide/en/content/system-color.png?fit=max&auto=format&n=jHjNTJCRmpMXi5vN&q=85&s=b277771553b8fd81b717eae717ff09e3" alt="系统默认颜色图标" width="281" height="166" data-path="images/write-and-edit/styling/quick-guide/en/content/system-color.png" />

不过，您可以完全控制文档和文本的颜色。手动选择喜欢的颜色，或在取色器中输入 RGB 代码以获得精准颜色。

<img src="https://mintcdn.com/craft-support/L5zMoIm2o8A5WVUD/images/write-and-edit/styling/quick-guide/en/content/custom-doc-color.gif?s=7c3927c0a80033062ad48fab51b026b1" alt="自定义文档颜色" width="800" height="673" data-path="images/write-and-edit/styling/quick-guide/en/content/custom-doc-color.gif" />

<Info title="重置颜色">
  使用重置按钮，可立即将文档恢复为系统默认颜色。
</Info>

<img src="https://mintcdn.com/craft-support/L5zMoIm2o8A5WVUD/images/write-and-edit/styling/quick-guide/en/content/reset-color.gif?s=52d971ac666bddfd6773f2afaf74d1a9" alt="重置文档颜色" width="426" height="390" data-path="images/write-and-edit/styling/quick-guide/en/content/reset-color.gif" />

## 字体

一键更改整个文档的字体样式。可选：

* **系统** - 使用设备的默认字体
* **衬线** - 传统、易读的衬线字体
* **等宽** - 用于代码或技术内容的等宽字体
* **圆角** - 友好、现代的圆角字体

<img src="https://mintcdn.com/craft-support/L5zMoIm2o8A5WVUD/images/write-and-edit/styling/quick-guide/en/content/fonts.gif?s=11732e87e5fcc8c62ace8900cbb879bf" alt="更改文档字体" width="800" height="685" data-path="images/write-and-edit/styling/quick-guide/en/content/fonts.gif" />

<Warning title="自定义字体">
  当前无法将自定义字体上传到 Craft。
</Warning>

## 将带样式的文档导出为 PDF

样式功能旨在帮助您表达自我并在编辑时创建理想的视觉环境。如果需要在导出为 PDF 时关闭样式，可在导出选项中轻松操作。

<img src="https://mintcdn.com/craft-support/L5zMoIm2o8A5WVUD/images/write-and-edit/styling/quick-guide/en/content/export-styles.gif?s=0b04cf70df6513a5d9144629f0400399" alt="导出为 PDF 时禁用样式" width="800" height="638" data-path="images/write-and-edit/styling/quick-guide/en/content/export-styles.gif" />

## 相关文章

<CardGroup cols={2}>
  <Card title="封面图片" href="/zh-Hans/write-and-edit/styling/cover-images">
    为文档自定义封面图片
  </Card>

  <Card title="卡片" href="/zh-Hans/write-and-edit/styling/cards">
    将页面转换为视觉卡片布局
  </Card>

  <Card title="应用样式" href="/zh-Hans/write-and-edit/styling/app-styles">
    将文档样式扩展到应用界面
  </Card>

  <Card title="默认样式" href="/zh-Hans/write-and-edit/styling/default-styles">
    将偏好的样式设置为默认
  </Card>
</CardGroup>