CSS 等宽字体的英文和汉字如何排列？

Question

我有一个textarea包含英文和中文文本的网络应用程序。问题是，我无法用标准等宽字体（Courier New 或 Lucida Console）完美地排列字母和字符：看起来中文文本的宽度几乎是英文文本的两倍，但不是 2x，而是 1.8 左右x，至少在 Windows 操作系统中，在我的情况下看起来很难看，特别是如果文本很长。

<textarea style="font-family:monospace;">      |
???|
123456|
Englis|</textarea>

有没有一种简单的方法可以使用 CSS 使汉字看起来比英文字母宽 2 倍？

Answer 1

在您的情况下，该monospace字体不支持中文字符，因此使用了（不需要的）后备中文字体，该字体与monospace字体中的英文字母不“配合”。

此外，尽管存在，但您无法使用 CSS 将字体的字形宽度更改为任何所需的宽度font-stretch。调整大小或宽度是有效的，但它会影响中文和英文文本，并且宽度基于空格的宽度。

不幸的是，没有简单的方法。最好的选择是使用等宽字体，并且支持中文字符，并且中文字符的宽度是英文字母的两倍。