# 行内内容

<figure><img src="https://2111890564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2FQcBDNerKxNvi1X3Jnk2R%2F26_01_22_inline-palette%402x.png?alt=media&#x26;token=08b0298b-627f-4394-addf-dd5b49cf3501" alt="A GitBook screenshot showing inline content options"><figcaption><p>为你的内容添加行内元素。</p></figcaption></figure>

行内工具面板让你无需把手离开键盘，就能快速为文本块添加额外内容。只需按下 `/` 在任意文本块中即可打开行内工具面板。斜杠会被你选择插入的内容替换。

## 注释

通过注释，你可以在不打断读者思路的情况下，为文字添加额外上下文。你可以用它们来解释词语含义、插入补充信息等等。读者可将鼠标悬停在带注释的文本上，以在文本上方显示注释。

### 创建注释

要创建注释，请选中你想要注释的文本，然后点击 **注释** 上下文菜单中的选项。写完注释后，点击其外部即可继续在文本块中写作。

### Markdown 表示形式

你可以将内容写成 [Markdown 脚注](https://www.markdownguide.org/extended-syntax/#footnotes) ，并将其作为 GitBook 中的注释添加。脚注标记应紧跟在你想要注释的单词之后；不应出现在标点符号或其他符号之后。

```markdown
这里有一个简单的脚注[^1]，还有一个更长的脚注[^bignote]。

[^1]: 这是第一个脚注。

[^bignote]: 这里有一个包含多个段落和代码的脚注。

    缩进段落可将其包含在脚注中。

    `{ my code }`

    你可以根据需要添加任意多个段落。
```

## 图片

行内图片会与你页面上的文本并排显示。

默认情况下，图片会按原始尺寸显示，最大宽度为 300px。你可以点击图片打开格式工具面板，然后选择以下三种选项之一来更改大小：

1. **行内大小：** 图片会按字体比例缩放——非常适合图标和徽章。
2. **原始大小：** 图片将以原始大小保持行内显示，最大宽度为 300 像素。
3. **转换为块：** 这会将行内图片转换为一个 [图片块](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/creating-content/blocks/insert-images)，其宽度与你的内容相同。

{% hint style="info" %}
[图片块](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/creating-content/blocks/insert-images) 提供更多选项，包括更多尺寸以及添加说明文字的能力——但不会以行内形式出现在你的文本中。
{% endhint %}

### 在 Markdown 中的表示

{% code overflow="wrap" %}

```markdown
这是一个行内图片：<img src=".gitbook/assets/GitBook - Dark.jpg" alt="Dark version of GitBook logo" data-size="line">
```

{% endcode %}

## 表情符号

你可以通过按下 `/` 来打开行内工具面板，从而添加表情符号。或者，输入 `:` ，表情符号列表会直接以行内方式弹出——你可以开始输入表情符号的名称来缩小选择范围。

### 在 Markdown 中的表示

{% code overflow="wrap" %}

```markdown
:house:
:car:
:dog:
```

{% endcode %}

## 链接

你可以插入三种不同类型的链接：

* [相对链接](#relative-links)
* [绝对链接](#absolute-links)
* [电子邮件地址 `mailto` 链接](#email-address-mailto-links)

### 相对链接

相对链接是通过链接到以下内容创建的： [页面](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/creating-content/content-structure/page) 在你的空间中已存在的页面。使用相对链接的优势在于，如果页面的 URL、名称或位置发生变化，其引用会保持最新——这样你最终会遇到更少的失效链接。

以下是插入相对链接的方法：

1. 在段落中点击你想插入链接的位置，或选中一些文本。
2. 按 / 打开行内工具面板并选择 Link，点击 **链接** 上下文菜单中的按钮，或者按下 **⌘ + K**.
3. 开始输入你想链接到的页面标题。
4. 从下拉搜索结果中选择该页面。
5. 按下 `Enter`.

### 绝对链接

绝对链接是可复制并粘贴到内容中的外部链接。当你想链接到文档外部的内容时，它们非常有用。

要插入绝对链接：

1. 在段落中点击你想插入链接的位置，或选中一些文本。
2. 按 / 打开行内工具面板并选择 Link，点击 **链接** 上下文菜单中的按钮，或者按下 **⌘ + K**.
3. 粘贴你想要链接的 URL。
4. 按下 `Enter`.

{% hint style="info" %}
**为什么外部链接不会在新标签页中打开？**

当你在文档中添加外部网站链接时，它会在同一标签页中打开。

GitBook 遵循这一 [W3C 推荐的行为](https://www.w3.org/TR/WCAG20-TECHS/G200.html) 以支持 [可访问性](https://it.wisc.edu/learn/make-it-accessible/websites-and-web-applications/when-to-open-links-in-a-new-tab/) 并为你的读者确保一致、包容的体验。
{% endhint %}

### 电子邮件地址 mailto 链接

电子邮件地址 `mailto` 链接在你希望访客点击后打开其默认邮件客户端，并填写 `收件人` 字段中的电子邮件地址时非常有用，这样他们就可以写邮件发送。

以下是插入电子邮件地址 `mailto` 链接的方法：

1. 在段落中点击你想插入链接的位置，或选中一些文本。
2. 按 / 打开行内工具面板并选择 Link，点击 **链接** 上下文菜单中的按钮，或者按下 **⌘ + K**.
3. 粘贴或输入 `mailto:something@address.com`，将 `something@address.com` 替换为你想使用的电子邮件地址。
4. 按下 `Enter`.

### 在 Markdown 中的表示

```markdown
[这是一个指向此空间中另一页面的相对链接](../content-structure/page.md)
[这是一个绝对链接](https://www.gitbook.com/blog)
[这是一个指向我们的支持邮箱地址的链接](mailto:support@gitbook.com)
```

## 数学与 TeX

使用此选项，你可以在内容中创建行内数学公式，例如： $$f(x) = x \* e^{2 pi i \xi x}$$。我们使用 [KaTeX](https://katex.org/docs/supported.html) 库来渲染公式。

{% hint style="info" %}
你也可以插入 [一个块级数学公式](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/creating-content/blocks/math-and-tex) ，方法是在空白块中打开命令面板并选择第二个 Math & TeX 选项。
{% endhint %}

### 在 Markdown 中的表示

```markdown
# 数学与 TeX 块

$$f(x) = x * e^{2 pi i \xi x}$$
```

## 按钮

按钮是突出显示行动号召，或在文档中添加搜索栏或 Ask AI 栏的绝佳方式。你可以用它们将读者引导到某处，或帮助他们找到答案。

### 按钮操作

按钮不仅可以链接到 URL。你还可以将按钮直接变成搜索栏或 GitBook Assistant 询问栏——就在页面上完成。这些操作在已发布的页面上也有效——正如你从下面的示例中所看到的。

你可以配置以下操作：

#### **添加链接按钮**

将读者发送到另一个页面或外部 URL：<a href="../../publishing-documentation/gitbook-ai-assistant" class="button primary" data-icon="gitbook-assistant">了解更多关于 Assistant 的信息</a>

#### **添加搜索栏**

打开搜索，并可选预设查询： <button type="button" class="button primary" data-action="search" data-icon="magnifying-glass">搜索...</button>

#### **添加 Ask AI/GitBook Assistant 栏**

打开 [GitBook Assistant](https://app.gitbook.com/s/NkEGS7hzeqa35sMXQZ4X/publishing-documentation/gitbook-ai-assistant) 并可选预设提示： <button type="button" class="button primary" data-action="ask" data-icon="gitbook-assistant">提出一个问题...</button>

#### **添加一个禁用按钮**

显示一个故意处于非活动状态的按钮：<a class="button primary">非活动按钮</a>

### 创建并配置按钮

1. 输入 `/` 并选择 **按钮**.
2. 点击按钮以打开 **标签** 菜单。
3. 选择一个操作，然后设置标签和样式。
4. 可选：添加预设搜索查询或 Assistant 提示。

### 样式

链接按钮和非活动按钮都有主样式和次样式。以下是几个示例：

<a href="https://app.gitbook.com/join" class="button primary">注册 GitBook</a> <a href="#annotations" class="button secondary">返回顶部</a>

### 在 Markdown 中的表示

```markdown
<a href="https://app.gitbook.com" class="button primary">GitBook</a>
```

## 图标

图标可为你的网站添加额外的视觉提示。你可以将它们以内联方式添加到段落中、卡片内，或任何需要增添风格的地方。它们将使用你在 [自定义设置](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/publishing-documentation/customization/icons-colors-and-themes).

<i class="fa-facebook">:facebook:</i> <i class="fa-github">:github:</i> <i class="fa-x-twitter">:x-twitter:</i> <i class="fa-instagram">:instagram:</i>

中定义的视觉样式 [Font Awesome](https://fontawesome.com/) 来浏览可用的不同图标。

### 在 Markdown 中的表示

```markdown
<i class="fa-github">:github:</i>
```

## 表达式

表达式允许你动态显示定义在某个 [变量](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/creating-content/variables-and-expressions)中的内容。表达式可以从 `/` 菜单中插入。插入后，点击表达式会打开表达式编辑器，让你能够引用并 [有条件地格式化](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_operator) 你的变量。