bootstrap文本大小写转换仅提供.text-lowercase、.text-uppercase、.text-capitalize三类css样式，通过text-transform属性实现视觉渲染变化，不修改dom原始文本，故不适用于表单提交或数据标准化场景。
Bootstrap 的文本大小写转换只提供三类 CSS 类，不涉及 JavaScript 逻辑或运行时计算，纯属样式层覆盖，所以没有“优缺点”可比——只有适用场景和限制是否匹配你的需求。
text-lowercase / text-uppercase / text-capitalize 分别做什么
这三个类直接作用于元素的 text-transform CSS 属性，不修改 DOM 中的实际文本内容，仅改变渲染效果：
-
text-lowercase→ 渲染为全小写（text-transform: lowercase） -
text-uppercase→ 渲染为全大写（text-transform: uppercase） -
text-capitalize→ 每个单词首字母大写，其余小写（text-transform: capitalize）
例如：
<p class="text-capitalize">hELLO wORLD</p>渲染结果是
Hello World，但 DOM 中仍是 hELLO wORLD。
为什么不能用这些类做表单输入或 API 提交前的格式化
因为它们只是视觉修饰，后端收到的仍是原始字符串。常见误用场景包括：
- 用户在
<input>上加text-uppercase，以为提交时会自动转大写 → 实际不会，input元素不支持该类（Bootstrap 官方文档明确说明这些类只适用于块级/行内文本容器，如p、span、div） - 用
text-capitalize处理人名（如mcDonald）→ CSS 的capitalize只按空格切分，无法识别连字符或大小写规则，结果变成Mcdonald，错误 - 依赖
text-uppercase显示带数字/符号的字符串（如SKU-123a）→ 会变成SKU-123A，但若业务要求字母部分大写、数字/连字符保持原样，CSS 无法精细控制
替代方案：什么时候该放弃 CSS 类，改用 JS 或后端处理
当需要真实变更字符串值、支持复杂规则、或影响数据流转时，必须脱离 CSS：
- 表单提交前标准化：用
.toUpperCase()或正则替换，再赋值给input.value - 国际化姓名处理：JS 库如
title-case或自定义函数，比text-capitalize更可靠 - API 请求字段规范：后端统一转大小写更安全，避免前端样式失效导致数据不一致
- SEO 或可访问性敏感内容：屏幕阅读器读取的是原始文本，不是渲染后效果，所以
text-uppercase不会影响语音输出
真正容易被忽略的一点：这些类对中文、日文等无大小写文字完全无效，但也不会报错；如果你混排中英文又依赖 text-capitalize 做标题格式，中文部分不变，英文部分被处理——这种“半生效”状态很难调试，建议先明确内容语种再决定是否启用。
