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
32
33
34
35
36
|
<!DOCTYPE html>
<!-- This test is tentative due to https://github.com/w3c/csswg-drafts/issues/6384 -->
<meta charset="UTF-8">
<title>font-size-adjust with the ic-height metric</title>
<link rel="author" title="ChangSeok Oh" href="mailto:changseok@chromium.org" />
<link rel="help" href="https://www.w3.org/TR/css-fonts-5/#valdef-font-size-adjust-ic-height" />
<link rel="match" href="font-size-adjust-ic-height-ref.html" />
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<meta name="assert" content="Test checks whether font-size-adjust with the ic-height metric adjusts font size.">
<style>
@font-face {
font-family: NotoSansCJK;
src: url(/fonts/noto/cjk/NotoSansCJKjp-Regular-subset-chws.otf);
}
div {
font-size: 100px;
background: green;
color: green;
writing-mode: vertical-rl;
text-orientation: upright;
}
.adjusted {
font-family: NotoSansCJK;
/* The NotoSansCJK font has 1.0 as an aspect value for the CJK water glyph
(i.e., the advance height of “水” / the font size).
Therefore, an ic-height 2.0 means a 200% scaling up. */
font-size-adjust: ic-height 2.0;
}
.fallback {
font-family: Ahem;
/* The Ahem font lacks vertical metrics, so a fallback is applied. */
font-size-adjust: ic-height 0.5;
}
</style>
<div class="adjusted">水</div>
<div class="fallback">水</div>
|
