> For the complete documentation index, see [llms.txt](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/zh/creating-content/blocks/code-block.md).
# 代码块
你可以使用代码块向你的 GitBook 页面添加代码。
添加代码块时，你可以选择 [设置语法](#set-syntax...), [显示行号](#with-line-numbers), [显示标题](#with-caption)，并且 [自动换行](#wrap-code)。此外，你也可以轻松地 [将代码块内容复制到剪贴板](#copying-the-code)，以便在其他地方使用
代码块可用于：
* 共享配置
* 添加代码片段
* 共享代码文件
* 展示命令行工具的使用示例
* 展示如何调用 API 端点
* 还有更多用途！
### 添加代码块
1. 要添加代码块，请将光标放在空白行上并输入 `/`.
2. 在快速插入菜单中，选择 **代码块**.
3. GitBook 会插入该块并将光标放在其中，方便你粘贴或输入代码。
### 代码块示例
{% code title="index.js" overflow="wrap" lineNumbers="true" %}
```javascript
import * as React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(, window.document.getElementById('root'));
```
{% endcode %}
你也可以将代码块与 [标签块](/url/gitbook.com/docs/documentation/zh/creating-content/blocks/tabs.md) 结合使用，以多种不同语言提供同一个代码示例：
{% tabs %}
{% tab title="JavaScript" %}
```javascript
let greeting = function (name) {
console.log(`Hello, ${name}!`);
};
greeting("Anna");
```
{% endtab %}
{% tab title="Ruby" %}
```ruby
greeting = lambda {|name| puts "Hello, #{name}!"}
greeting.("Anna")
```
{% endtab %}
{% tab title="Elixir" %}
```elixir
greeting = fn name -> IO.puts("Hello, #{name}!") end
greeting.("Anna")
```
{% endtab %}
{% endtabs %}
### 代码块选项
当你点击 **选项菜单** ，或点击 **操作菜单** 时，你会看到一些可设置的选项。
#### 设置语法…
你可以将代码块的语法设置为任何受支持的语言。这样也会启用该语言的语法高亮。
{% hint style="info" %}
我们使用 [Prism](https://github.com/PrismJS/prism) 进行语法高亮。你可以使用 [Test Drive Prism](https://prismjs.com/test.html#language=markup) 查看 Prism 支持哪些语言。如果你发现 GitBook 与 Prism 之间不一致，可能是我们落后了一两个版本。我们会尽快跟上！
{% endhint %}
{% code title="filename.txt" %}
```
// Some code
```
{% endcode %}
#### 带行号
这将切换代码行号的显示与隐藏。
当代码整体代表某个文件的内容，或者代码块很长、行数很多时，显示行号会很有用。对于代码片段、命令行使用说明、终端表达式以及类似场景，隐藏行号会更有用。
#### 带标题
这将切换显示一个位于块顶部、代码行上方的标题。
该标题通常是文件名，如 [上面的示例所示](#example-of-a-code-block)，但你也可以将其用作标题、说明，或任何你想要的内容。
#### 代码自动换行
这将切换代码自动换行，因此较长的代码行会换行显示，让所有内容都能一次性在页面上看到。
当代码很长、你想避免查看者来回滚动阅读时，换行会很有用。如果你将 **代码自动换行** 打开，你可能还想显示行号——这会让阅读代码并理解新行从哪里开始更容易。
#### 可展开
这将切换为完整显示代码（当开关关闭时）或显示一个可折叠的代码窗口，用户可以展开它（当开关打开时）。
折叠视图默认显示 10 行代码，并提供一个可展开按钮以显示完整代码块。如果代码少于 10 行，则会显示全部内容。
### 代码块操作
除了上面的选项外，你还可以更改代码块显示的语言，并立即复制你的代码。
#### 复制代码
将鼠标悬停在代码块上，会出现一些图标。点击中间的图标即可将代码块内容复制到剪贴板。
### Markdown 表示形式
````markdown
{% code title="index.js" overflow="wrap" lineNumbers="true" %}
```javascript
import * as React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(, window.document.getElementById('root'));
```
{% endcode %}
````
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/zh/creating-content/blocks/code-block.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.