summaryrefslogtreecommitdiffstats
path: root/layout/reftests/font-variations/font-optical-sizing-1.html
blob: 8520d74bc1f983bcb2c52d522726b8b2fdd342a4 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<style>
@font-face {
  font-family: Voto;
  src: url(../fonts/VotoSerifGX.latin1.ttf);
}
body {
  font-family: Voto;
  font-variation-settings: "wght" 50;
  font-optical-sizing: auto;
}
span {
  font-variation-settings: "wght" 100; /* Voto weights are non-standard,
                                          so this is actually quite bold */
}
</style>
</head>
<body>
<div style="font-size: 9px">Voto <span>bold</span> at 9px</div>
<div style="font-size: 12px">Voto <span>bold</span> at 12px</div>
<div style="font-size: 16px">Voto <span>bold</span> at 16px</div>
<div style="font-size: 24px">Voto <span>bold</span> at 24px</div>
<div style="font-size: 32px">Voto <span>bold</span> at 32px</div>
<div style="font-size: 48px">Voto <span>bold</span> at 48px</div>
<div style="font-size: 72px">Voto <span>bold</span> at 72px</div>
<div style="font-size: 96px">Voto <span>bold</span> at 96px</div>
</body>
</html>