升级Source Sans 3后如何控制文本选中区域高度？

a. 现象是否正常，是否完全由字体决定无法干预？ #

• 该现象正常，文本选中区域的高度核心由字体内部的ascender（上升高度）、descender（下降高度）及字体度量信息决定。Source Sans 3作为同系列升级款，大概率调整了这些度量参数，导致选中区域高度和旧版Source Sans Pro产生差异。
• 并非完全无法干预：浏览器虽以字体度量为核心依据，但也可通过特定CSS属性对选中区域的视觉表现进行微调，只是直接控制的空间有限。

b. 调整选中区域高度接近升级前状态的方法 #

既然你已尝试过line-height，可参考以下方案：

1. 利用font-size-adjust校准垂直布局
   该属性基于字体的x-height比例调整字体显示尺寸，能间接影响选中区域的垂直范围。你可以对比Source Sans Pro和Source Sans 3的x-height比例，设置对应数值（比如font-size-adjust: 0.52;，具体需根据两款字体实际参数微调），让文本的垂直视觉表现更贴近旧版。

2. 自定义选中样式替代原生效果
   通过隐藏原生选中样式，用伪元素模拟自定义高度的选中背景，示例代码：

/* 隐藏原生选中背景 */
::selection {
  background: transparent;
}
/* 给需要自定义选中的文本容器加类 */
.text-container {
  position: relative;
  display: inline-block;
}
/* 模拟选中背景，通过top/bottom调整高度 */
.text-container.selected::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 2px; /* 向上缩小选中区域高度 */
  bottom: 2px; /* 向下缩小选中区域高度 */
  background-color: #b4d5ff; /* 匹配原生选中背景色 */
  z-index: -1;
}

此方法需配合JavaScript监听文本选中事件，给对应容器添加/移除selected类，适合需要高度自定义的场景。

3. 结合vertical-align微调文本位置
   在调整line-height至接近Source Sans Pro的数值基础上，搭配vertical-align的具体数值（比如vertical-align: -0.08em），微调文本在行框内的垂直位置，进而优化选中区域的视觉高度。

4. 调整可变字体的光学尺寸轴
   Source Sans 3作为可变字体，支持opsz（光学尺寸）可变轴。你可以尝试设置font-variation-settings: 'opsz' 16;（不同数值测试），部分光学尺寸下的字体度量可能更接近Source Sans Pro的表现。

内容的提问来源于stack exchange，提问作者Tim