初始尺寸

height

height 设置整个编辑器的高度，包括菜单栏、工具栏和状态栏。

  • 如果提供数字，TinyMCE 默认以像素为单位设置高度。

  • 如果提供字符串，TinyMCE 假定该值是有效的 CSS，并将编辑器高度设置为该字符串值，例如 300px、50pt 或 10em。

注意：目前不支持 100%、10vh 和 auto 等值。

类型：Number 或 String

默认值：400，或者如果目标元素大于 400 像素，则为该元素的大小

示例：使用 height

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  height: 300
});

width

设置编辑器的宽度。

如果提供数字，TinyMCE 将以像素为单位设置宽度。但是，如果 TinyMCE 接收到字符串，它会假定该值是有效的 CSS，并将编辑器的宽度直接设置为该字符串值。这允许使用替代单位，例如 %、em 和 vh。

类型：Number 或 String

示例：使用 width

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  width: 300
});

控制用户编辑器调整大小

resize

此选项允许禁用调整大小的手柄，或将调整大小的处理程序设置为同时水平调整和垂直调整。该选项可以是 true、false 或字符串 'both'。False 禁用调整大小，true 仅启用垂直调整大小，'both' 允许水平和垂直两个方向调整大小。

当启用调整大小功能时，可以通过以下方式调整编辑器大小：

  • 点击并拖动编辑器右下角的调整大小手柄。

  • 聚焦调整大小手柄并使用箭头键。上箭头和左箭头键将使编辑器变小，下箭头和右箭头键将使编辑器变大。

类型：Boolean 或 String

默认值：true

可能的值：true、false、'both'

此选项的默认值在移动设备上有所不同。有关移动默认选项的信息，请参阅：TinyMCE Mobile — 具有移动默认值的配置选项。

示例：禁用编辑器调整大小

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  resize: false
});

示例：启用垂直和水平编辑器调整大小

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  resize: 'both'
});

min_height

min_height 选项的行为会因 autoresize 插件是否启用而有所不同：

  • 未启用 autoresize 插件：设置用户可以通过拖动右下角的调整大小手柄手动缩小整个 TinyMCE 界面的最小高度。

  • 已启用 autoresize 插件：设置在内容被移除时编辑器可以自动缩小到的最小高度。

类型：Number

默认值：100

示例：使用 min_height

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  min_height: 200
});

  • 如果 resize 选项设置为 false，调整大小手柄将被禁用，用户无法手动调整编辑器大小。

  • 当启用 autoresize 插件时，resize 选项默认为 false。

  • 值以像素为单位指定，不带单位。

  • 将 min_height 设置得太低可能会在移动设备上导致可用性问题。

  • 如果在使用 autoresize 插件时未设置 min_height，编辑器将默认使用标准的 min_height 值 100 像素。

max_height

max_height 选项的行为会因 autoresize 插件是否启用而有所不同：

  • 未启用 autoresize 插件：设置用户可以通过拖动右下角的调整大小手柄手动调整整个 TinyMCE 界面的最大高度。

  • 已启用 autoresize 插件：设置在内容被添加时编辑器可以自动扩展到的最大高度。

类型：Number

示例：使用 max_height

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  max_height: 500
});

  • 如果 resize 选项设置为 false，则调整大小手柄将被禁用，用户无法手动调整编辑器大小。

  • 启用 autoresize 插件时，resize 选项默认为 false。

  • 值以像素为单位指定，不带单位。

  • 如果使用 autoresize 插件时未设置 max_height，编辑器将默认采用标准的 max_height 行为（无限制高度扩展）。

min_width

此选项设置用户可拉伸整个 TinyMCE 界面的最小宽度（通过拖动编辑器界面右下角的可拖动区域）。

此行为与 autoresize 插件不同，后者仅控制可编辑区域的大小调整，而非整个编辑器。

类型： Number

示例：使用 min_width

tinymce.init({
  selector: 'textarea',  // 根据需要修改此值以匹配您的 HTML
  min_width: 400
});
默认情况下，resize 手柄不支持水平拖动，设置此键的值不会产生可观察的行为。

max_width

此选项设置用户可拉伸整个 TinyMCE 界面的最大宽度（通过拖动编辑器界面右下角的可拖动区域）。

此行为与 autoresize 插件不同，后者仅控制可编辑区域的大小调整，而非整个编辑器。

类型： Number

示例：使用 max_width

tinymce.init({
  selector: 'textarea',  // 根据需要修改此值以匹配您的 HTML
  max_width: 500
});
默认情况下，resize 手柄不支持水平拖动，设置此键的值不会产生可观察的行为。

自动调整编辑器大小

可配置 TinyMCE 根据编辑器内容自动调整大小。有关配置自动调整大小的更多信息，请参阅：Autoresize 插件。