[css-fonts-4] Migrate font-size property from level 3

Author: litherum

css-fonts-4/Overview.bs

@@ -305,7 +305,151 @@ at least as dark as its predecessor. Only values between 1 - 999 are valid, and
 
 <h3 id="font-size-prop">Font size: the 'font-size' property</h3>
 
-    Issue: Import from level 3
+	<pre class="propdef">
+	Name: font-size
+	Value: <<absolute-size>> | <<relative-size>> | <<length-percentage>>
+	Initial: medium
+	Applies to: all elements
+	Inherited: yes
+	Percentages: refer to parent element's font size
+	Computed value: absolute length
+	Media: visual
+	Animatable: As <<length>>
+	</pre>
+
+    This property indicates the desired height of glyphs from the
+    font. For scalable fonts, the font-size is a scale factor applied to the EM unit
+    of the font. (Note that certain glyphs may bleed outside their EM box.) For
+    non-scalable fonts, the font-size is converted into absolute units and matched
+    against the declared font-size of the font, using the same absolute coordinate
+    space for both of the matched values.
+    Values have the following meanings:
+
+	<dl dfn-for=font-size dfn-type=value>
+		<dt><dfn><<absolute-size>></dfn></dt>
+		<dd>
+			An <<absolute-size>> keyword refers to an entry
+			in a table of font sizes computed and kept by the user agent. Possible values
+			are:
+
+			[ xx-small | x-small | small | medium | large | x-large | xx-large ]
+		</dd>
+
+		<dt><dfn><<relative-size>></dfn></dt>
+		<dd>
+    		A <<relative-size>> keyword is interpreted
+    		relative to the table of font sizes and the computed 'font-size' of the
+    		parent element. Possible values are:
+
+    		[ larger | smaller ]
+
+    		For example, if the parent element has a font size of
+    		'medium', a value of 'larger' will make the font size of the
+    		current element be 'large'.  If the parent element's size is not
+    		close to a table entry, the user agent is free to interpolate
+    		between table entries or round off to the closest one. The user
+    		agent may have to extrapolate table values if the numerical value
+    		goes beyond the keywords.
+		</dd>
+
+		<dt><dfn><<length-percentage>></dfn></dt>
+		<dd>
+    		A length value specifies an absolute font size
+        	(independent of the user agent's font table).
+        	Negative lengths are invalid.
+
+			A percentage value specifies an absolute font size relative
+        	to the parent element's font size. Use of percentage values, or
+        	values in 'em's, leads to more robust and cascadable style sheets.
+      		Negative percentages are invalid.
+		</dd>
+	</dl>
+
+	The following table provides user agent guidelines for the
+	absolute-size scaling factor and their mapping to HTML heading and
+	absolute font-sizes. The 'medium' value is used as the reference
+	middle value. The user agent may fine-tune these values for different
+	fonts or different types of display devices.
+
+	<table class="data">
+	<thead>
+	  <th>CSS absolute-size values</th>
+	  <th>xx-small</td>
+	  <th>x-small</td>
+	  <th>small</td>
+	  <th>medium</td>
+	  <th>large</td>
+	  <th>x-large</td>
+	  <th>xx-large</td>
+	  <th>&nbsp;</td>
+	</thead>
+	<tbody>
+	  <tr>
+	    <th>scaling factor</th>
+	    <td>3/5</td>
+	    <td>3/4</td>
+	    <td>8/9</td>
+	    <td>1</td>
+	    <td>6/5</td>
+	    <td>3/2</td>
+	    <td>2/1</td>
+	    <td>3/1</td>
+	  </tr>
+	  <tr>
+	    <th>HTML headings</th>
+	    <td>h6</td>
+	    <td>&nbsp;</td>
+	    <td>h5</td>
+	    <td>h4</td>
+	    <td>h3</td>
+	    <td>h2</td>
+	    <td>h1</td>
+	    <td>&nbsp;</td>
+	  </tr>
+	  <tr>
+	    <th>HTML font sizes</th>
+	    <td>1</td>
+	    <td>&nbsp;</td>
+	    <td>2</td>
+	    <td>3</td>
+	    <td>4</td>
+	    <td>5</td>
+	    <td>6</td>
+	    <td>7</td>
+	  </tr>
+	</tbody>
+	</table>
+
+	<p class="note"><strong>Note 1.</strong> To preserve readability, an UA applying
+	these guidelines should nevertheless avoid creating font-size resulting
+	in less than 9 device pixels per EM unit on a computer display.</p>
+
+	<p class="note"><strong>Note 2.</strong> In CSS1, the suggested
+	scaling factor between adjacent indexes was 1.5 which user experience
+	proved to be too large. In CSS2, the suggested scaling factor for computer
+	screen between adjacent indexes was 1.2 which still created issues for the small
+	sizes. The new scaling factor varies between each index to provide a better
+	readability.</p>
+
+	The actual value of this property may differ from the computed
+	value due a numerical value on 'font-size-adjust' and the
+	unavailability of certain font sizes.
+
+	Child elements inherit the computed 'font-size' value (otherwise, the
+	effect of 'font-size-adjust' would compound).
+
+	<div class="example">
+	<pre>
+	p { font-size: 12pt; }
+	blockquote { font-size: larger }
+	em { font-size: 150% }
+	em { font-size: 1.5em }
+	</pre>
+	</div>
+
+<h3 id="font-size-adjust-prop">Relative sizing: the 'font-size-adjust' property</h3>
+
+	TODO: Migrate this from level 3.
 
 <h2 id="font-resources">Font Resources</h2>