html - 文本转换 : full-width doesn't work in Opera - html

Question

<div style="position: relative; left: 30px; top: 20px; width: 200px; height: 30px; border: solid 1px black; text-align: center; vertical-align: middle; line-height: 30px; text-transform: full-width;">
<span style="color: #999999; font-family: tahoma; font-size: 12px; text-transform: full-width;" onmouseover="this.style.color='#000000';" onmouseout="this.style.color='#999999';">Example Text</span></div>

http://jsfiddle.net/CQwbQ/

所以我在 div 中有一些文本，我注意到文本转换在 Opera 中不起作用(它在 Firefox 中正常工作)。我有最新的 Opera 版本。

我尝试了所有组合 - 将 text-transform: full-width; 放在 span 中，而不是放在 div 中，而不是放在两者中......

如何解决这个问题？

Answer 1

text-transform full-width 的值目前仅受 Firefox 支持。您可以向 Opera 提交错误报告，但由于该值仅在工作草案级别文档中定义 (CSS Text Module Level 3)，我认为它不会引起太多关注。

解决方法:

1) 在内容的适用部分添加一段 JavaScript 代码，将 ASCII 字符替换为相应的全 Angular 字符(例如 U+FF21 的“A”)。

2) 在服务器端或预处理中进行相同的替换。更稳健。