---
title: "字体大小扩展"
description: "使用字体大小扩展在您的 Tiptap 编辑器中设置自定义字体大小。了解更多信息，请查看我们的文档。"
canonical_url: "https://tiptap.zhcndoc.com/editor/extensions/functionality/fontsize"
---

# 字体大小扩展

使用字体大小扩展在您的 Tiptap 编辑器中设置自定义字体大小。了解更多信息，请查看我们的文档。

此扩展允许您在编辑器中设置字体大小。它使用 [`TextStyle`](https://tiptap.zhcndoc.com/editor/extensions/marks/text-style.md) 标记，该标记呈现为 `<span>` 标签。字体大小作为内联样式应用，例如 `<span style="font-size: 14px">`。

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

## 安装

```bash
npm install @tiptap/extension-text-style
```

此扩展需要 [`TextStyle`](https://tiptap.zhcndoc.com/editor/extensions/marks/text-style.md) 标记。

```ts
import { Editor } from '@tiptap/core'
import { TextStyle, FontSize } from '@tiptap/extension-text-style'

new Editor({
  extensions: [TextStyle, FontSize],
})
```

此扩展默认与 `TextStyleKit` 扩展一起安装，因此您无需单独安装它。

```ts
import { Editor } from '@tiptap/core'
import { TextStyleKit } from '@tiptap/extension-text-style'

new Editor({
  extensions: [TextStyleKit],
})
```

## 设置

### types

应用字体系列属性的标记列表。

默认值: `['textStyle']`

```js
FontSize.configure({
  types: ['textStyle'],
})
```

## 命令

### setFontSize()

将给定的字体系列作为内联样式应用。

```js
editor.commands.setFontSize('14px')
```

### unsetFontSize()

移除任何字体系列。

```js
editor.commands.unsetFontSize()
```

## 源代码

[packages/extension-text-style/src/font-size/](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-text-style/src/font-size)

## 最小安装

```js
import { Editor } from '@tiptap/core'
import { FontSize } from '@tiptap/extension-text-style/font-size'

new Editor({
  extensions: [FontSize],
})
```