我的理解是＆＃34; vw＆＃34; CSS中的单位是指视口宽度的1％增量。
但是，当我创建一个单倍间距的字体，应该是视口宽度的10％时，it winds up closer to ~6% (1/16)：
<div style="width: 100%; background: green; color: white; font-size: 10vw; font-family: monospace;">
123456789012345670
</div>
如果我使用的字体不是等宽字体，那就不那么糟了，但它仍然关闭：
<div style="width: 100%; background: green; color: white; font-size: 10vw; font-family: serif;" id="test8">
MMMMMMMMMMMMMMMMMMMM
</div>
我正在使用＆＃34; M＆＃34;因为这是典型的最广泛的角色＆＃34;任何字体。在this case中，我看到11个字符，因此每个字符大约是视口宽度的9％。这仍然是10％。
那是什么给出的？什么＆＃34; vw＆＃34;实际上是指与字体大小一起使用时，特别是当每个字符具有相同的宽度时？
答案 0 :(得分：3)
指定font-size描述了em-square的大小。字体度量包括每个字形的前进宽度，其与em-square成比例。它是预先宽度（以及字母和单词间距）的总和，用于确定一行中适合的字符数。
例如，如果我们采用等宽的Windows Courier New字体，则字形都具有相同的前进宽度，即字体大小的1229/2048。
所以，如果我们的字体大小为10vw，字母和字间距为0，那么我们应该在一个＆＃39的行框中得到100 /（10 x 1229/2048）= 16.66个字符（或截断后的16个字符） ; s与视口一样宽。
body {
margin:0;
font-size:10vw;
font-family:'Courier New';
word-break:break-all;
}ABCDEFGHIJKLMNOPQRSTUVWXYZ