首页 文章

CSS缩放字母间距与流体字体大小成比例

提问于
浏览
0

我正在使用一种基于视图宽度缩放文本的技术here . 它使用一个简单的公式在字体大小的设定范围(最小/最大)内平滑缩放,具体取决于设定范围内的视图宽度(最小/最大) . 它工作得很好 .

但我正在面对这个和其他流体字体大小技术的问题 . 如果我将字母间距设置为常量值,它可能会在视觉上分解 . 显示为20px的字体的1px字母间距可能不适合以50px显示的字体 .

在某些情况下,用户可能会更改字体大小 . 这将是同样的问题 .

是否有一个可靠的方法来处理这个流动的问题,使字母间距与字体大小成比例?

2 回答

  • 0

    尝试使用 em 单位来控制间距 .

    这里有一个可能的参考:https://cssreference.io/property/letter-spacing/

  • 1

    我尝试使用calc,以及视图宽度:

    letter-spacing: calc(1px + (10 - 1) * ((100vw - 320px) / (1440 - 320)));
    

    它有效,但我认为使用ems更好 .

相关问题