---
title: "横线扩展"
description: "在 Tiptap 中使用横线扩展来渲染 `` HTML 标签以分隔内容。在我们的文档中了解更多！"
canonical_url: "https://tiptap.zhcndoc.com/editor/extensions/nodes/horizontal-rule"
---

# 横线扩展

在 Tiptap 中使用横线扩展来渲染 `` HTML 标签以分隔内容。在我们的文档中了解更多！

使用这个扩展来渲染 `<hr>` HTML 标签。如果你在编辑器的初始内容中传入 `<hr>`，它会相应地被渲染出来。

在新行的开头输入三个破折号（---）或者三个下划线加空格（\_\_\_ ），它们会神奇地变成一条横线。

> **Interactive demo:** [HorizontalRule](https://embed.tiptap.dev/preview/Nodes/HorizontalRule)

## 安装

```bash
npm install @tiptap/extension-horizontal-rule
```

## 设置

### HTMLAttributes

自定义将添加到渲染HTML标签中的属性。

```js
HorizontalRule.configure({
  HTMLAttributes: {
    class: 'my-custom-class',
  },
})
```

## 命令

### setHorizontalRule()

创建一条水平线。

```js
editor.commands.setHorizontalRule()
```

## 源代码

[packages/extension-horizontal-rule/](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-horizontal-rule/)