我有一个h1我想适合视口的整个宽度,该视口由等宽字体中的13个字符组成。阅读有关视口大小的排版的CSS-Tricks文章后,如果要实现此目的似乎合乎逻辑,我只需要将h1的样式设置为:
h1 {
font-size: 13vw;
font-family: monospace;
}
Run Code Online (Sandbox Code Playgroud)
但是,这是在渲染时留下了一些空间(突出显示文本以查看空白):
(这里会有一个图像,但是我没有足够的代表,所以请单击此处获取JSFiddle)
我试过其他尺寸,font-size: 14vw;
有点太大,font-size: 13.99vw;
似乎刚刚好,但奇怪的font-size: 13.999vw;
是仍然太大吗?
有人可以解释这里发生了什么吗?为什么等宽字体中的13个字符长的字符串的每个字符都需要大于(100/13)%的视口宽度才能适合整个视口宽度?