Add font metric override descriptors

Author: xiaochengh

css-fonts-4/Overview.bs

@@ -2908,6 +2908,68 @@ Initial: normal
 
 This descriptor defines initial settings that apply when the font defined by an @font-face rule is rendered. It does not affect font selection. Values are identical to those defined for the 'font-language-override!!property' property defined below except that the value inherit is omitted. When multiple font feature descriptors, properties, or variations are used, the cumulative effect on text rendering is detailed in the section [[#font-feature-variation-resolution]] below.
 
+<h3 id="font-metrics-override-desc">
+Default font metrics overriding:
+the 'ascent-override', 'descent-override' and 'line-gap-override' descriptors</h3>
+
+<pre class='descdef'>
+Name: ascent-override
+Value: normal | <<percentage>>
+For: @font-face
+Initial: normal
+</pre>
+
+<pre class='descdef'>
+Name: descent-override
+Value: normal | <<percentage>>
+For: @font-face
+Initial: normal
+</pre>
+
+<pre class='descdef'>
+Name: line-gap-override
+Value: normal | <<percentage>>
+For: @font-face
+Initial: normal
+</pre>
+
+These 'ascent-override', 'descent-override' and 'line-gap-override' descriptors define the values
+of the ascent, descent and line gap metrics of the font.
+
+When the descriptor value is 'normal', the metric value is obtained from the font file directly.
+
+Note: User agents may choose different pieces of data from the font file as the metric value,
+leading to different layouts. For example, Chrome on Windows uses sTypoAscender, sTypoDescender
+and sTypoLineGap from the font's OS/2 table, while on Mac, it uses those in the HHEA table if available.
+
+When the descriptor value is a percentage, the metric value is set to the given percentage of the
+em size of the font.
+
+<div class="example">
+	We may override the metrics of Arial as follows:
+
+<pre>@font-face {
+  font-family: arial;
+  src: local(Arial), url("http://example.com/arial.woff");
+  ascent-override: 60%;
+  descent-override: 40%;
+  line-gap-override: 0%;
+}
+</pre>
+
+	Then for an element with the following style:
+
+<pre>
+font-family: arial;
+font-size: 20px;
+line-height: normal;
+</pre>
+
+	Each line box will be exactly 20px high. Text baseline will be positioned at 12px
+	below line box top.
+
+</div>
+
 <h2 id="font-matching-algorithm">Font Matching Algorithm</h2>
 
 The algorithm below describes how fonts are associated with individual runs of text.