text-transform: uppercase仅改变英文字符视觉显示为大写，不修改原始值、不影响中文数字标点，复制粘贴和表单提交仍为原文，需JavaScript才能真正转换字符串。
text-transform: uppercase 能让表格里的英文字母“看起来”全大写，但它不改原始值、不处理中文数字、也不能保证复制粘贴或提交时也是大写——这点没想清楚，后面准出问题。
表格单元格加 text-transform: uppercase 就行
对 td、th 这类含文本的单元格直接设样式即可，不需要额外 wrapper 元素：
<table> <tr><td style="text-transform: uppercase;">hello world</td></tr> <tr><td style="text-transform: uppercase;">API-2024</td></tr> </table>
- 生效范围：只作用于 ASCII 字母（A–Z）、部分拉丁扩展字符（如 é、ñ），对中文、阿拉伯数字、标点符号完全无影响
- 继承性好：给
table或tbody设该样式，子td/th默认继承 - 局部覆盖：某列要保持原样，给对应
td加text-transform: none
别在 input 或 contenteditable 表格单元格里用 text-transform
如果表格里嵌了可编辑控件（比如 <td><input type="text"></td>），加 text-transform: uppercase 会误导用户：
-
input.value仍是小写，后端收到的也是小写，校验可能失败 - 用户复制单元格内容时，粘贴出来是 “hello”，不是 “HELLO”
-
contenteditable="true"的td同样存在这个问题，视觉和数据不一致 - 真需要输入即转大写，得用 JavaScript 监听
input事件并调用toUpperCase()，同时手动维护光标位置
text-transform: uppercase 和 JavaScript toUpperCase() 别混着用
两者目标不同，混用容易翻车：
立即学习“前端免费学习笔记（深入）”；
- CSS 版本只改渲染，JS 版本才真改字符串
- 如果后端要求字段必须大写（比如订单号、SKU），仅靠 CSS 不够，必须在提交前执行
el.value = el.value.toUpperCase() - 国际化场景下注意：CSS 对土耳其语等特殊大小写规则无效；
String.prototype.toUpperCase()可传locales参数提升准确性 - 表格导出为 CSV 或 Excel 时，CSS 不起作用——导出逻辑必须自己调用
toUpperCase()
真正麻烦的不是怎么让字母变大写，而是你得想清楚：这个“大写”到底要出现在哪一层？是用户眼睛看到的，还是数据库存进去的，还是 API 接口比对用的。漏掉任意一层，就等于没做。
