如何使用 CSS 控制光标/插入符号的大小答案

【问题标题】：How to control cursor/caret size with CSS如何使用 CSS 控制光标/插入符号的大小
【发布时间】：2011-08-30 18:12:42
【问题描述】：

我正在尝试控制 html 文本区域中的插入符号大小。大小好像默认为行高，有办法手动控制吗？

【问题讨论】：

可以通过css设置行高。
是的，我感谢@LeRoy，不幸的是我需要保持行高不变。它相当大，因此插入符号与字体大小相比显得异常大。
看看这个可能会有一些想法：stackoverflow.com/a/3758063/1830909

标签： html css

【解决方案1】：

没有任何方法可以更改插入符号在文本区域中的外观。如果你想这样做，你将不得不使用文本区域以外的东西，例如 div 或 canvas 元素，并使用 JavaScript 控制一切。

【讨论】：

其实有一种方法可以在css和js中用 caret-color 或 caretColor 改变插入符号的颜色

【解决方案2】：

值得注意的是，某些字体的默认大小和光标位置看起来很奇怪。如果这对您来说是一个高优先级，那么至少考虑切换到不同的字体可能是值得的。以下是一种看起来非常奇怪的 Google 字体和两种看起来不奇怪的 Google 字体的示例：

您可能还幸运地生成了具有不同设置的 webfont 文件。专家模式下的 font squirrel webfont generator 具有 垂直指标 和 x 高度匹配 的设置，可能有助于解决此问题。来自不同代工厂的大多数付费网络字体现在也有类似的导出设置。调整设置、重复导出、安装新文件和检查工作绝对是一项耗时的任务，但通常是值得的。

【讨论】：