工作表里的文本框常用来放通知、提醒或一句结论，但它的默认样式十分朴素：黑色小字、白色底、一圈细边框，放在表格旁边容易被当成普通单元格。把字体放大加重并铺上一层底色，文字就会从表格中浮出来；调整内边距与自动换行，长句才不会挤在边框上或伸出框外；去掉边框，文本框又能安静地充当注释。这些调整都可以用代码批量完成，不必逐个手动修改。Spire.XLS for JavaScript 基于 WebAssembly 在浏览器端直接完成这些操作，通过虚拟文件系统（VFS）管理输入输出文件，无需后端服务支持。

本文介绍两个核心功能点：

• 调整文本框的字体、背景色与边框
• 设置文本框的内边距与自动换行

有关安装和项目配置，请参考 React 项目中集成 Spire.XLS for JavaScript。以下示例默认已安装 Spire.XLS 并完成 WebAssembly 模块初始化。

调整文本框的字体、背景色与边框

调整文本框的字体、背景色与边框，可以让它在该醒目时醒目，在该安静时安静。默认的 11 号黑色文字与白色底面缺少区分度，把字号调大、文字加重、换一种颜色，再铺一层浅色底，提示就会从表格中浮出来；反过来，去掉与表格线纠缠的边框，文字又像是直接写在纸面上，适合做脚注与角标。这两类调整既可以作用于同一个文本框，也可以分别用在不同的文本框上。

具体操作步骤如下：

1. 用 sheet.TextBoxes.get(0) 取第一个文本框。
2. 用 workbook.CreateFont() 新建字体对象，并通过 FontName、Size、IsBold、Color 设置字体名称、字号、加粗与文字颜色。
3. 用 xlsModule.RichTextShape.Convert(textBox.RichText) 取得富文本对象，再调用 SetFont(0, textBox.Text.length - 1, font) 把字体应用到整段文字。
4. 把 textBox.Fill.FillType 设为 xlsModule.ShapeFillType.SolidColor，再用 textBox.Fill.ForeColor 指定填充色。
5. 用 sheet.TextBoxes.get(3) 取第四个文本框，把 textBox.Line.Weight 设为 0，移除它的边框。
6. 用 workbook.SaveToFile 保存工作簿。

以下为完整的代码示例，演示如何调整文本框的字体、背景色与边框：

function App() {
  const adjustTextAppearance = async () => {
    // 获取 Spire.XLS WASM 模块
    const xlsModule = window.wasmModule?.spirexls;

    // 检查模块是否就绪
    if (!xlsModule) {
      alert('Spire.Xls is not ready yet');
      return;
    }

    // 将字体与测试数据文件载入 VFS
    await window.spire.FetchFileToVFS('simsun.ttc', '/Library/Fonts/', `${process.env.PUBLIC_URL}/font/`);
    const inputFileName = 'TextBoxSample.xlsx';
    await window.spire.FetchFileToVFS(inputFileName, '', `${process.env.PUBLIC_URL}data/`);

    // 加载工作簿，取第一张工作表
    const workbook = new xlsModule.Workbook();
    workbook.LoadFromFile({ fileName: inputFileName });
    const sheet = workbook.Worksheets.get(0);

    // 取第一个文本框，创建字体并设置名称、字号、加粗与颜色
    const textBox = sheet.TextBoxes.get(0);
    const font = workbook.CreateFont();
    font.FontName = '宋体';
    font.Size = 14;
    font.IsBold = true;
    font.Color = xlsModule.Color.FromArgb(255, 28, 68, 118);

    // 把字体应用到这个文本框的全部文字上
    const richText = xlsModule.RichTextShape.Convert(textBox.RichText);
    richText.SetFont(0, textBox.Text.length - 1, font);

    // 用纯色填充文本框的背景
    textBox.Fill.FillType = xlsModule.ShapeFillType.SolidColor;
    textBox.Fill.ForeColor = xlsModule.Color.FromArgb(255, 232, 240, 250);

    // 取第四个文本框，把边框粗细设为 0，边框随之消失
    const borderBox = sheet.TextBoxes.get(3);
    borderBox.Line.Weight = 0;

    // 保存工作簿
    const outputFileName = 'TextAppearance.xlsx';
    workbook.SaveToFile({ fileName: outputFileName });

    // 释放 workbook 对象以释放资源
    workbook.Dispose();

    // 从 VFS 读取结果文件，触发下载
    const fileArray = window.dotnetRuntime.Module.FS.readFile(outputFileName);
    const blob = new Blob([fileArray], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
    const url = URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = outputFileName;
    a.click();
    URL.revokeObjectURL(url);
  };

  return (
    <div style={{ textAlign: 'center', height: '300px' }}>
      <h1>格式化 Excel 文本框</h1>
      <button onClick={adjustTextAppearance}>调整文本框的字体、背景色与边框</button>
    </div>
  );
}

export default App;

调整字体、背景色与边框后的通知公告：

设置文本框的内边距与自动换行

设置文本框的内边距与自动换行，能让框内文字疏密得当、长句不溢出。文字紧贴边框时读起来很挤，深色底纹下尤其明显；内边距在文字与边框之间留出空白，四个方向可以分别设置。窄框里的长句默认只占一行，多出来的部分会越过框边，打开自动换行后则折到下一行。示例把左右两侧各留出约 1 厘米、上下两侧各留出约 0.4 厘米，并把文字对齐到左上角，内边距带来的位移才看得清楚。

具体操作步骤如下：

1. 用 sheet.TextBoxes.get(1) 取第二个文本框。
2. 依次设置 InnerLeftMargin、InnerRightMargin、InnerTopMargin、InnerBottomMargin，为四边留出空白。
3. 把 HAlignment 设为 xlsModule.CommentHAlignType.Left，VAlignment 设为 xlsModule.CommentVAlignType.Top，让文字从左上角开始排版。
4. 用 sheet.TextBoxes.get(2) 取第三个文本框，把 IsWrapText 设为 true，打开自动换行。
5. 用 workbook.SaveToFile 保存工作簿。

以下为完整的代码示例，演示如何设置文本框的内边距与自动换行：

function App() {
  const setTextLayout = async () => {
    // 获取 Spire.XLS WASM 模块
    const xlsModule = window.wasmModule?.spirexls;

    // 检查模块是否就绪
    if (!xlsModule) {
      alert('Spire.Xls is not ready yet');
      return;
    }

    // 将字体与测试数据文件载入 VFS
    await window.spire.FetchFileToVFS('simsun.ttc', '/Library/Fonts/', `${process.env.PUBLIC_URL}/font/`);
    const inputFileName = 'TextBoxSample.xlsx';
    await window.spire.FetchFileToVFS(inputFileName, '', `${process.env.PUBLIC_URL}data/`);

    // 加载工作簿，取第一张工作表
    const workbook = new xlsModule.Workbook();
    workbook.LoadFromFile({ fileName: inputFileName });
    const sheet = workbook.Worksheets.get(0);

    // 取第二个文本框，设置文字与左、右、上、下边框之间的内边距
    const textBox = sheet.TextBoxes.get(1);
    textBox.InnerLeftMargin = 1;
    textBox.InnerRightMargin = 1;
    textBox.InnerTopMargin = 0.4;
    textBox.InnerBottomMargin = 0.4;

    // 让文字贴着左上角排版，内边距的效果才看得出来
    textBox.HAlignment = xlsModule.CommentHAlignType.Left;
    textBox.VAlignment = xlsModule.CommentVAlignType.Top;

    // 取第三个文本框，打开自动换行，文字到达框宽后折到下一行
    const wrapBox = sheet.TextBoxes.get(2);
    wrapBox.IsWrapText = true;

    // 保存工作簿
    const outputFileName = 'TextLayout.xlsx';
    workbook.SaveToFile({ fileName: outputFileName });

    // 释放 workbook 对象以释放资源
    workbook.Dispose();

    // 从 VFS 读取结果文件，触发下载
    const fileArray = window.dotnetRuntime.Module.FS.readFile(outputFileName);
    const blob = new Blob([fileArray], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
    const url = URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = outputFileName;
    a.click();
    URL.revokeObjectURL(url);
  };

  return (
    <div style={{ textAlign: 'center', height: '300px' }}>
      <h1>格式化 Excel 文本框</h1>
      <button onClick={setTextLayout}>设置文本框的内边距与自动换行</button>
    </div>
  );
}

export default App;

设置内边距与自动换行后的通知公告：

常见问题

如何按名称获取文本框？

原因：按索引获取需要记住文本框在集合中的排列顺序，插入或删除文本框后顺序会发生变化。

解决：用 sheet.TextBoxes.get("TextBox 2") 按名称获取。

如何只给文本框中的部分文字设置格式？

原因：文本框的文字以富文本保存，SetFont 按字符范围生效，范围之外的部分保持原样。

解决：先用 xlsModule.RichTextShape.Convert(textBox.RichText) 取得富文本对象，再用 richText.SetFont(起始索引, 结束索引, font) 指定范围。例如 SetFont(0, 3, font) 只作用于前四个字符。

文本框的边框可以改成其他颜色或虚线吗？

原因：Line 对象除粗细外，还提供颜色与线型设置。

解决：用 textBox.Line.ForeColor 设置边框颜色，textBox.Line.Weight 设置粗细，textBox.Line.DashStyle 指定线型，取值为 xlsModule.ShapeDashLineStyleType 的成员，例如 Dashed 表示虚线。

文字没有按预期换行怎么办？

原因：只有 IsWrapText 为 true 时文字才会折行；文本框宽度足以容纳整句时，也不会出现换行。

解决：确认已设置 textBox.IsWrapText = true，并检查文本框宽度是否小于整句文字的长度。需要显示多行时，同时给文本框留出足够的高度。

获取免费许可证

如果您希望删除结果文档中的评估消息，或者摆脱功能限制，请该Email地址已收到反垃圾邮件插件保护。要显示它您需要在浏览器中启用JavaScript。获取有效期 30 天的临时许可证。