Contribute to this guide

指南表格列大小调整

TableColumnResize 插件允许您调整表格和单个表格列的大小。 它让您完全控制列宽。

# 演示

要调整列的大小,只需将指针悬停在列边缘上,直到它被突出显示。 拖动列边缘,直到达到所需大小。

太阳系的矮行星

名称 区域 轨道半径 (AU) 轨道周期 (年) 卫星数量
谷神星 小行星带 2.768 4.6 -
厄耳枯斯 柯伊伯带 39.40 247.3 1
冥王星 柯伊伯带 39.48 247.9 5
妊神星 柯伊伯带 43.22 284.1 2
夸欧尔 柯伊伯带 43.69 288.8 1
鸟神星 柯伊伯带 45.56 307.5 1
共工星 离散盘 67.38 553.1 1
阋神星 离散盘 67.78 558.0 1
塞德娜 分离 506.8 11,400 无数据

此演示展示了一组有限的功能。 访问 功能丰富的编辑器示例 以查看更多实际应用。

列大小调整功能与 导出为 Word 功能兼容。 转换器将尊重在编辑器中设置的列宽,并在创建的 .DOCX 文件中保留它。

# 安装

⚠️ 新的导入路径

42.0.0 版 开始,我们更改了导入路径的格式。 本指南使用新的、更短的格式。 如果您使用的是旧版本的 CKEditor 5,请参考 旧版设置中的包 指南。

安装编辑器 后,将功能添加到插件列表和工具栏配置中

import { ClassicEditor, Table, TableColumnResize } from 'ckeditor5';

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        plugins: [ Table, TableColumnResize, /* ... */ ],
        toolbar: [ 'insertTable', /* ... */ ],
    } )
    .then( /* ... */ )
    .catch( /* ... */ );

# 通用 API

TableColumnResize 插件不注册 UI 组件。

我们建议使用官方 CKEditor 5 检查器 进行开发和调试。 它将为您提供有关编辑器状态的大量有用信息,例如内部数据结构、选择、命令等等。

# 贡献

该功能的源代码可在 GitHub 上获得,地址为 https://github.com/ckeditor/ckeditor5/tree/master/packages/ckeditor5-table