我在这里使用了一种基于视图宽度缩放文本的技术。它使用一个简单的公式在字体大小的设置范围(最小/最大(内平滑缩放,具体取决于设置范围(最大/最小(内的视图宽度。它工作得很好。
但我面临着一个问题,这个和其他技术的流动字体大小。如果我将字母间距设置为一个常数值,它可能会在视觉上崩溃。当字体显示为50px时,以20px显示的字体的1px字母间距可能不理想。
在某些情况下,用户可能会更改字体大小。这将是同样的问题。
有没有一种可靠的方法来处理这个不稳定的问题,使字母间距与字体大小成比例?
尝试使用em
单元来控制间距。
这里有一个可能的参考:https://cssreference.io/property/letter-spacing/
我尝试使用calc和视图宽度:
letter-spacing: calc(1px + (10 - 1) * ((100vw - 320px) / (1440 - 320)));
它有效,但我认为使用ems更好。