必须手动绑定toolbar按钮点击事件并监听table.on("tool(表名)")，通过addClass/removeClass切换预设字号类，同步更新th/td/固定列，再调用table.resize()重算列宽。
表格工具栏按钮如何绑定字号控制逻辑
直接在 toolbar 配置里加按钮是没用的——layui 的表格工具栏默认只响应内置事件（如 lay-event="del"），不自动执行任意 js。必须手动绑定点击事件，并拿到当前表格实例才能操作行内 dom。
常见错误是把按钮写成普通 HTML 后就以为能触发，结果点击完全没反应；或者用了 lay-event 却没在 on("tool") 里处理，导致事件监听失效。
- 按钮必须放在
toolbar对应的模板字符串中，且带唯一lay-event值，比如lay-event="set-font-size" - 必须用
table.on("tool(你的表名)", ...)监听该事件，不能写成on("tool")（漏掉过滤器） - 字号修改不能只改
<td>，要同步改<th>和可能存在的固定列、合计行等，否则视觉错乱
如何安全地批量修改所有行字体大小
Layui 表格渲染后，数据行在 .layui-table-body tbody tr 下，但直接用 $("tbody tr td") 会误改分页栏、加载提示等非数据区域。更稳妥的方式是通过表格实例的 config.elem 定位专属容器。
另外，用 css("font-size") 覆盖会破坏原有 em/rem 设置，推荐用 class 切换——提前定义好 .layui-table-sm、.layui-table-lg 这类语义化类名，再用 addClass/removeClass 控制。
- 不要用
document.querySelectorAll("td")，优先走tableIns.config.elem.find("tbody td, thead th") - 避免直接设
style="font-size:14px"，否则后续用 CSS 覆盖困难；统一用 class 控制，比如layui-table-font-sm - 记得重置
.layui-table-fixed里的对应列，否则左右滚动时字号不一致
如何让字号变化实时生效且不破坏表格布局
单纯改 font-size 可能导致单元格高度塌陷或文字溢出，尤其当内容含多行文本或图标时。Layui 的 cellMinWidth 和 minWidth 是基于默认字号计算的，字号变大后需手动调用 table.resize() 重新测量列宽。
另一个坑是：如果表格启用了 height 固定高度，增大字号后行高超出，会出现滚动条遮挡或内容截断——此时要么取消 height，要么配合 cellHeight 动态调整行高。
- 每次修改字号后，必须调用
table.resize(tableIns.config.id)，否则列宽不会自适应 - 若设置了
height: 500，建议同时用css("line-height", "24px")匹配新字号，防止行高挤压 - 图标字体（如
）字号会随父级变化，无需单独处理，但要确认 iconfont 文件支持缩放
完整可运行的最小改动示例
假设表格容器 ID 是 demo，工具栏按钮要控制三档字号（12px / 14px / 16px）：
<script type="text/html" id="TABLE_TOOLBAR">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-sm" lay-event="font-sm">小</button>
<button class="layui-btn layui-btn-sm" lay-event="font-md">中</button>
<button class="layui-btn layui-btn-sm" lay-event="font-lg">大</button>
</div>
</script>
<table id="demo" lay-filter="demo"></table>
<script>
table.render({
elem: '#demo',
toolbar: '#TABLE_TOOLBAR',
// ...其他配置
});
table.on('tool(demo)', function(obj){
const $ = layui.jquery;
const tableIns = obj.config;
const $table = tableIns.config.elem;
if(obj.event === 'font-sm'){
$table.removeClass('layui-table-font-md layui-table-font-lg').addClass('layui-table-font-sm');
} else if(obj.event === 'font-md'){
$table.removeClass('layui-table-font-sm layui-table-font-lg').addClass('layui-table-font-md');
} else if(obj.event === 'font-lg'){
$table.removeClass('layui-table-font-sm layui-table-font-md').addClass('layui-table-font-lg');
}
table.resize(tableIns.config.id); // 关键：重算列宽
});
</script>
CSS 部分只需补充三类样式，作用于整个表格容器即可，不用侵入每列：
.layui-table-font-sm .layui-table-body td,
.layui-table-font-sm .layui-table-header th { font-size: 12px; }
.layui-table-font-md .layui-table-body td,
.layui-table-font-md .layui-table-header th { font-size: 14px; }
.layui-table-font-lg .layui-table-body td,
.layui-table-font-lg .layui-table-header th { font-size: 16px; }
真正麻烦的不是加按钮，而是确保所有浮动层（如弹出菜单、下拉选择器）、固定列、甚至打印样式都跟着字号同步变化——这些往往被忽略，直到用户反馈“导出 PDF 字太小”才想起来补。
