drafts: changeset 6658:187e80cf2131

     1.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     1.2 +++ b/css3-text-decor/Overview.html	Wed Sep 05 14:53:15 2012 -0700
     1.3 @@ -0,0 +1,1678 @@
     1.4 +<!DOCTYPE html>
     1.5 +
     1.6 +<html lang=en>
     1.7 + <head profile="http://dublincore.org/documents/2008/08/04/dc-html/ ">
     1.8 +  <meta content="text/html; charset=utf-8" http-equiv=Content-Type>
     1.9 +  <title>CSS Text Decoration Module Level 3 (CSS3 Text Decoration)</title>
    1.10 +
    1.11 +  <link href="http://purl.org/dc/terms/" rel=schema.DC>
    1.12 +  <meta content="CSS Text Decoration Module Level 3 (CSS3 Text Decoration)"
    1.13 +   name=DC.title>
    1.14 +  <meta content=text name=DC.type>
    1.15 +  <meta content=2012-09-05 name=DC.issued>
    1.16 +  <meta content="Elika J. Etemad" name=DC.creator>
    1.17 +  <meta content="Koji Ishii" name=DC.creator>
    1.18 +  <meta content=W3C name=DC.publisher>
    1.19 +  <meta content="http://www.w3.org/TR/2012/WD-css3-text-20120905/"
    1.20 +   name=DC.identifier>
    1.21 +  <link href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright"
    1.22 +   rel=DC.rights>
    1.23 +  <link href="#contents" rel=contents>
    1.24 +  <link href="#index" rel=index>
    1.25 +  <link href="../default.css" rel=stylesheet type="text/css">
    1.26 +  <link href="http://www.w3.org/StyleSheets/TR/W3C-WD.css" rel=stylesheet
    1.27 +   type="text/css">
    1.28 +
    1.29 + <body>
    1.30 +  <div class=head> <!--begin-logo-->
    1.31 +   <p><a href="http://www.w3.org/"><img alt=W3C height=48
    1.32 +    src="http://www.w3.org/Icons/w3c_home" width=72></a> <!--end-logo-->
    1.33 +
    1.34 +   <h1>CSS Text Decoration Module Level 3</h1>
    1.35 +
    1.36 +   <h2 class="no-num no-toc" id=longstatus-date>W3C Working Draft 5 September
    1.37 +    2012</h2>
    1.38 +
    1.39 +   <dl>
    1.40 +    <dt>This version:</dt>
    1.41 +    <!--
    1.42 +    <dd><a href="http://dev.w3.org/csswg/css3-text/">$Date$ (CVS $Revision$)</a>
    1.43 +  -->
    1.44 +
    1.45 +    <dd><a
    1.46 +     href="http://www.w3.org/TR/2012/WD-css3-text-20120905/">http://www.w3.org/TR/2012/WD-css3-text-20120905/</a>
    1.47 +
    1.48 +    <dt>Latest version:
    1.49 +
    1.50 +    <dd><a
    1.51 +     href="http://www.w3.org/TR/css3-text/">http://www.w3.org/TR/css3-text/</a>
    1.52 +
    1.53 +    <dt>Latest editor's draft:
    1.54 +
    1.55 +    <dd><a
    1.56 +     href="http://dev.w3.org/csswg/css3-text/">http://dev.w3.org/csswg/css3-text/</a>
    1.57 +
    1.58 +    <dt>Previous version:
    1.59 +
    1.60 +    <dd><a
    1.61 +     href="http://www.w3.org/TR/2012/WD-css3-text-20120119/">http://www.w3.org/TR/2012/WD-css3-text-20120119/</a>
    1.62 +
    1.63 +    <dt>Issues List:
    1.64 +
    1.65 +    <dd><a
    1.66 +     href="http://www.w3.org/Style/CSS/Tracker/products/10">http://www.w3.org/Style/CSS/Tracker/products/10</a>
    1.67 +
    1.68 +    <dt>Discussion:
    1.69 +
    1.70 +    <dd><a
    1.71 +     href="http://lists.w3.org/Archives/Public/www-style/">www-style@w3.org</a>
    1.72 +     with subject line “<kbd>[css3-text] <var>… message topic
    1.73 +     …</var></kbd>”
    1.74 +
    1.75 +    <dt>Editors:
    1.76 +
    1.77 +    <dd><a href="http://fantasai.inkedblade.net/contact">Elika J. Etemad</a>
    1.78 +     (Mozilla)
    1.79 +
    1.80 +    <dd><a href="mailto:koji.a.ishii@mail.rakuten.com">Koji Ishii</a>
    1.81 +     (Rakuten, Inc.)
    1.82 +   </dl>
    1.83 +   <!--begin-copyright-->
    1.84 +   <p class=copyright><a
    1.85 +    href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright"
    1.86 +    rel=license>Copyright</a> © 2012 <a href="http://www.w3.org/"><abbr
    1.87 +    title="World Wide Web Consortium">W3C</abbr></a><sup>®</sup> (<a
    1.88 +    href="http://www.csail.mit.edu/"><abbr
    1.89 +    title="Massachusetts Institute of Technology">MIT</abbr></a>, <a
    1.90 +    href="http://www.ercim.eu/"><abbr
    1.91 +    title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></a>,
    1.92 +    <a href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved. W3C <a
    1.93 +    href="http://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>,
    1.94 +    <a
    1.95 +    href="http://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a>
    1.96 +    and <a
    1.97 +    href="http://www.w3.org/Consortium/Legal/copyright-documents">document
    1.98 +    use</a> rules apply.</p>
    1.99 +   <!--end-copyright-->
   1.100 +   <hr title="Separator for header">
   1.101 +  </div>
   1.102 +
   1.103 +  <h2 class="no-num no-toc" id=abstract>Abstract</h2>
   1.104 +
   1.105 +  <p>This module contains the features of CSS relating to text decoration,
   1.106 +   such as underlines, text shadows, and emphasis marks. <a
   1.107 +   href="http://www.w3.org/TR/CSS/">CSS</a> is a language for describing the
   1.108 +   rendering of structured documents (such as HTML and XML) on screen, on
   1.109 +   paper, in speech, etc.
   1.110 +
   1.111 +  <h2 class="no-num no-toc" id=status>Status of this document</h2>
   1.112 +
   1.113 +  <p><em>This section describes the status of this document at the time of
   1.114 +   its publication. Other documents may supersede this document. A list of
   1.115 +   current W3C publications and the latest revision of this technical report
   1.116 +   can be found in the <a href="http://www.w3.org/TR/">W3C technical reports
   1.117 +   index at http://www.w3.org/TR/.</a></em>
   1.118 +
   1.119 +  <p>Publication as a Working Draft does not imply endorsement by the W3C
   1.120 +   Membership. This is a draft document and may be updated, replaced or
   1.121 +   obsoleted by other documents at any time. It is inappropriate to cite this
   1.122 +   document as other than work in progress.
   1.123 +
   1.124 +  <p>This CSS module has been produced as a combined effort of the <a
   1.125 +   href="http://www.w3.org/International/Activity">W3C Internationalization
   1.126 +   Activity</a>, and the <a href="http://www.w3.org/Style/Activity">Style
   1.127 +   Activity</a> and is maintained by the <a
   1.128 +   href="http://www.w3.org/Style/CSS/members">CSS Working Group</a>. It also
   1.129 +   includes contributions made by participants in the <a
   1.130 +   href="http://www.w3.org/Style/XSL/Group/">XSL Working Group</a> (<a
   1.131 +   href="http://cgi.w3.org/MemberAccess/AccessRequest">members only</a>).
   1.132 +
   1.133 +  <p>This document was produced by a group operating under the <a
   1.134 +   href="http://www.w3.org/Consortium/Patent-Policy-20040205/">5 February
   1.135 +   2004 W3C Patent Policy</a>. W3C maintains a <a
   1.136 +   href="http://www.w3.org/2004/01/pp-impl/32061/status"
   1.137 +   rel=disclosure>public list of any patent disclosures</a> made in
   1.138 +   connection with the deliverables of the group; that page also includes
   1.139 +   instructions for disclosing a patent. An individual who has actual
   1.140 +   knowledge of a patent which the individual believes contains <a
   1.141 +   href="http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential">Essential
   1.142 +   Claim(s)</a> must disclose the information in accordance with <a
   1.143 +   href="http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure">section
   1.144 +   6 of the W3C Patent Policy</a>.
   1.145 +
   1.146 +  <p><strong>Feedback on this draft should be posted to the (<a
   1.147 +   href="http://lists.w3.org/Archives/Public/www-style/">archived</a>) public
   1.148 +   mailing list <a
   1.149 +   href="mailto:www-style@w3.org">www-style@w3.org</a></strong> (see <a
   1.150 +   href="http://www.w3.org/Mail/Request">instructions</a>) <strong>with
   1.151 +   <kbd>[css3-text]</kbd> in the subject line.</strong> You are strongly
   1.152 +   encouraged to complain if you see something stupid in this draft. The
   1.153 +   editors will do their best to respond to all feedback.
   1.154 +
   1.155 +  <p>The following features are at risk and may be cut from the spec during
   1.156 +   its CR period if there are no (correct) implementations:
   1.157 +
   1.158 +  <p>The following features are at risk and may be cut from the spec during
   1.159 +   its CR period if there are no (correct) implementations:
   1.160 +
   1.161 +  <ul>
   1.162 +   <li>the ‘<a href="#text-decoration-skip"><code
   1.163 +    class=property>text-decoration-skip</code></a>’ property / ‘<code
   1.164 +    class=css>ink</code>’ value
   1.165 +  </ul>
   1.166 +
   1.167 +  <h2 id=intro><span class=secno>1. </span> Introduction</h2>
   1.168 +
   1.169 +  <p>[document here]
   1.170 +
   1.171 +  <p class=issue>This draft describes features that are specific to certain
   1.172 +   scripts. There is an ongoing discussion about where these features belong:
   1.173 +   in existing CSS properties, in new CSS properties, or perhaps in other
   1.174 +   specifications.
   1.175 +
   1.176 +  <h3 id=placement><span class=secno>1.1. </span> Module Interactions</h3>
   1.177 +
   1.178 +  <p>This module replaces and extends the text-level features defined in <a
   1.179 +   href="#CSS21" rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a> chapter 16.
   1.180 +
   1.181 +  <h3 id=values><span class=secno>1.2. </span> Values</h3>
   1.182 +
   1.183 +  <p>This specification follows the <a
   1.184 +   href="http://www.w3.org/TR/CSS21/about.html#property-defs">CSS property
   1.185 +   definition conventions</a> from <a href="#CSS21"
   1.186 +   rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a>. Value types not defined in
   1.187 +   this specification are defined in CSS Level 2 Revision 1 <a
   1.188 +   href="#CSS21" rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a>. Other CSS
   1.189 +   modules may expand the definitions of these value types: for example <a
   1.190 +   href="#CSS3COLOR" rel=biblioentry>[CSS3COLOR]<!--{{CSS3COLOR}}--></a>,
   1.191 +   when combined with this module, expands the definition of the
   1.192 +   &lt;color&gt; value type as used in this specification.
   1.193 +
   1.194 +  <p>In addition to the property-specific values listed in their definitions,
   1.195 +   all properties defined in this specification also accept the <a
   1.196 +   href="http://www.w3.org/TR/CSS21/cascade.html#value-def-inherit">inherit</a>
   1.197 +   keyword as their property value. For readability it has not been repeated
   1.198 +   explicitly.
   1.199 +
   1.200 +  <p>The <dfn id=currentcolor>‘<code class=css>currentcolor</code>’</dfn>
   1.201 +   keyword here computes to itself and is resolved to the value of ‘<code
   1.202 +   class=property>color</code>’ after inheritance is performed. This is so
   1.203 +   that the ‘<a href="#text-emphasis-color"><code
   1.204 +   class=property>text-emphasis-color</code></a>’ by default matches the
   1.205 +   text ‘<code class=property>color</code>’. <span class=issue>CSS3 Color
   1.206 +   has not yet been errata'd to define it this way; currentcolor there is
   1.207 +   defined to compute to the value of ‘<code
   1.208 +   class=property>color</code>’, which gives it the wrong inheritance
   1.209 +   behavior.</span>
   1.210 +
   1.211 +  <h3 id=terms><span class=secno>1.3. </span>Terminology</h3>
   1.212 +
   1.213 +  <p>The terms <a
   1.214 +   href="http://www.w3.org/TR/css3-text/#grapheme-cluster"><dfn
   1.215 +   id=character>character</dfn></a>, <a
   1.216 +   href="http://www.w3.org/TR/css3-text/#letter"><dfn
   1.217 +   id=letter>letter</dfn></a>, and <a
   1.218 +   href="http://www.w3.org/TR/css3-text/#content-language"><dfn
   1.219 +   id=content-language>content language</dfn></a> as used in this
   1.220 +   specification are defined in <a href="#CSS3TEXT"
   1.221 +   rel=biblioentry>[CSS3TEXT]<!--{{!CSS3TEXT}}--></a>. Other terminology and
   1.222 +   concepts used in this specification are defined in <a href="#CSS21"
   1.223 +   rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a> and <a
   1.224 +   href="#CSS3-WRITING-MODES"
   1.225 +   rel=biblioentry>[CSS3-WRITING-MODES]<!--{{!CSS3-WRITING-MODES}}--></a>.
   1.226 +
   1.227 +  <h2 id=line-decoration><span class=secno>2. </span> Line Decoration:
   1.228 +   Underline, Overline, and Strike-Through</h2>
   1.229 +
   1.230 +  <p>The following properties describe line decorations that are added to the
   1.231 +   content of an element. When specified on or propagated to an inline box,
   1.232 +   such decoration affects all the boxes generated by that element, and is
   1.233 +   further propagated to any in-flow block-level boxes that split the inline
   1.234 +   (see <a
   1.235 +   href="http://www.w3.org/TR/CSS21/visuren.html#anonymous-block-level">CSS2.1
   1.236 +   section 9.2.1.1</a>) When specified on or propagated to a ruby box, the
   1.237 +   decorations are further propagated only to the ruby base. When specified
   1.238 +   on or propagated to a a block container that establishes an inline
   1.239 +   formatting context, the decorations are propagated to an anonymous inline
   1.240 +   element that wraps all the in-flow inline-level children of the block
   1.241 +   container. For all other elements, the decorations are propagated to any
   1.242 +   in-flow children.
   1.243 +
   1.244 +  <p class=note>Note that text decorations are not propagated to any
   1.245 +   out-of-flow descendants, nor to the contents of atomic inline-level
   1.246 +   descendants such as inline blocks and inline tables.
   1.247 +
   1.248 +  <p>By default underlines, overlines, and line-throughs are applied only to
   1.249 +   text (including white space, letter spacing, and word spacing): margins,
   1.250 +   borders, and padding are skipped. Elements containing no text, such as
   1.251 +   images, are likewise not decorated. The ‘<a
   1.252 +   href="#text-decoration-skip"><code
   1.253 +   class=property>text-decoration-skip</code></a>’ property can be used to
   1.254 +   modify this behavior, for example allowing inline replaced elements to be
   1.255 +   underlined or requiring that white space be skipped.
   1.256 +
   1.257 +  <p>In determining the position and thickness of text decoration lines, user
   1.258 +   agents may consider the font sizes and dominant baselines of descendants,
   1.259 +   but for a given element's decoration must use the same position and
   1.260 +   thickness throughout each line box. The <a
   1.261 +   href="#text-decoration-color">color</a> and <a
   1.262 +   href="#text-decoration-style">line style</a> of decorations must remain
   1.263 +   the same on all decorations applied by a given element, even if descendant
   1.264 +   elements have different color or line style values.
   1.265 +
   1.266 +  <div class=example>
   1.267 +   <p>The following figure shows the averaging for underline:
   1.268 +
   1.269 +   <p><img
   1.270 +    alt="In the first rendering of the underlined text '1st a'                  with 'st' as a superscript, both the '1st' and the 'a'                  are rendered in a small font. In the second rendering,                  the 'a' is rendered in a larger font. In the third, both                  '1st' and 'a' are large."
   1.271 +    height=105 src=underline-averaging.gif width=326>
   1.272 +
   1.273 +   <p>In the three fragments of underlined text, the underline is drawn
   1.274 +    consecutively lower and thicker as the ratio of large text to small text
   1.275 +    increases.
   1.276 +  </div>
   1.277 +
   1.278 +  <p>Relatively positioning a descendant moves all text decorations affecting
   1.279 +   it along with the descendant's text; it does not affect calculation of the
   1.280 +   decoration's initial position on that line. The ‘<code
   1.281 +   class=property>visibility</code>’ property, filters, and other graphical
   1.282 +   transformations likewise affect text decorations as part of the text
   1.283 +   they're drawn on, even if the decorations were specified on an ancestor
   1.284 +   element. <span class=issue>Does this include ‘<a
   1.285 +   href="#text-shadow"><code class=property>text-shadow</code></a>’? What
   1.286 +   about text-fill etc.?</span>
   1.287 +
   1.288 +  <div class=example>
   1.289 +   <p>In the following style sheet and document fragment:
   1.290 +
   1.291 +   <pre><code class=css>
   1.292 +<!-- -->   blockquote { text-decoration: underline; color: blue; }
   1.293 +<!-- -->   em { display: block; }
   1.294 +<!-- -->   cite { color: fuchsia; }
   1.295 +<!----></code></pre>
   1.296 +
   1.297 +   <pre class=html><code>
   1.298 +<!-- -->   &lt;blockquote&gt;
   1.299 +<!-- -->    &lt;p&gt;
   1.300 +<!-- -->     &lt;span&gt;
   1.301 +<!-- -->      Help, help!
   1.302 +<!-- -->      &lt;em&gt; I am under a hat! &lt;/em&gt;
   1.303 +<!-- -->
   1.304 +<!-- -->      &lt;cite&gt; —GwieF &lt;/cite&gt;
   1.305 +<!-- -->     &lt;/span&gt;
   1.306 +<!-- -->    &lt;/p&gt;
   1.307 +<!-- -->   &lt;/blockquote&gt;
   1.308 +<!----></code></pre>
   1.309 +
   1.310 +   <p>...the underlining for the blockquote element is propagated to an
   1.311 +    anonymous inline element that surrounds the span element, causing the
   1.312 +    text "Help, help!" to be blue, with the blue underlining from the
   1.313 +    anonymous inline underneath it, the color being taken from the blockquote
   1.314 +    element. The <code>&lt;em&gt;text&lt;/em&gt;</code> in the em block is
   1.315 +    also underlined, as it is in an in-flow block to which the underline is
   1.316 +    propagated. The final line of text is fuchsia, but the underline
   1.317 +    underneath it is still the blue underline from the anonymous inline
   1.318 +    element.
   1.319 +
   1.320 +   <p><img alt="Sample rendering of the above underline example"
   1.321 +    src=underline-example.png>
   1.322 +
   1.323 +   <p>This diagram shows the boxes involved in the example above. The rounded
   1.324 +    aqua line represents the anonymous inline element wrapping the inline
   1.325 +    contents of the paragraph element, the rounded blue line represents the
   1.326 +    span element, and the orange lines represent the blocks.
   1.327 +  </div>
   1.328 +
   1.329 +  <h3 id=text-decoration-line-property><span class=secno>2.1. </span> Text
   1.330 +   Decoration Lines: the ‘<a href="#text-decoration-line"><code
   1.331 +   class=property>text-decoration-line</code></a>’ property</h3>
   1.332 +
   1.333 +  <table class=propdef>
   1.334 +   <tbody>
   1.335 +    <tr>
   1.336 +     <th>Name:
   1.337 +
   1.338 +     <td><dfn id=text-decoration-line>text-decoration-line</dfn>
   1.339 +
   1.340 +    <tr>
   1.341 +     <th><a href="#values">Value</a>:
   1.342 +
   1.343 +     <td>none | [ underline || overline || line-through ]
   1.344 +
   1.345 +    <tr>
   1.346 +     <th>Initial:
   1.347 +
   1.348 +     <td>none
   1.349 +
   1.350 +    <tr>
   1.351 +     <th>Applies to:
   1.352 +
   1.353 +     <td>all elements
   1.354 +
   1.355 +    <tr>
   1.356 +     <th>Inherited:
   1.357 +
   1.358 +     <td>no (but see prose)
   1.359 +
   1.360 +    <tr>
   1.361 +     <th>Percentages:
   1.362 +
   1.363 +     <td>N/A
   1.364 +
   1.365 +    <tr>
   1.366 +     <th>Media:
   1.367 +
   1.368 +     <td>visual
   1.369 +
   1.370 +    <tr>
   1.371 +     <th>Computed value:
   1.372 +
   1.373 +     <td>as specified
   1.374 +  </table>
   1.375 +
   1.376 +  <p>Specifies what line decorations, if any, are added to the element.
   1.377 +   Values have the following meanings:
   1.378 +
   1.379 +  <dl>
   1.380 +   <dt><dfn id=none title="text-decoration-line:none">‘<code
   1.381 +    class=css>none</code>’</dfn>
   1.382 +
   1.383 +   <dd>Neither produces nor inhibits text decoration.
   1.384 +
   1.385 +   <dt><dfn id=underline>‘<code class=css>underline</code>’</dfn>
   1.386 +
   1.387 +   <dd>Each line of text is underlined.
   1.388 +
   1.389 +   <dt><dfn id=overline>‘<code class=css>overline</code>’</dfn>
   1.390 +
   1.391 +   <dd>Each line of text has a line above it (i.e. on the opposite side from
   1.392 +    an underline).
   1.393 +
   1.394 +   <dt><dfn id=line-through>‘<code class=css>line-through</code>’</dfn>
   1.395 +
   1.396 +   <dd>Each line of text has a line through the middle.
   1.397 +  </dl>
   1.398 +
   1.399 +  <h3 id=text-decoration-color-property><span class=secno>2.2. </span> Text
   1.400 +   Decoration Color: the ‘<a href="#text-decoration-color"><code
   1.401 +   class=property>text-decoration-color</code></a>’ property</h3>
   1.402 +
   1.403 +  <table class=propdef>
   1.404 +   <tbody>
   1.405 +    <tr>
   1.406 +     <th>Name:
   1.407 +
   1.408 +     <td><dfn id=text-decoration-color>text-decoration-color</dfn>
   1.409 +
   1.410 +    <tr>
   1.411 +     <th><a href="#values">Value</a>:
   1.412 +
   1.413 +     <td><a href="http://www.w3.org/TR/css3-color/#color0"><span
   1.414 +      class=value-inst-color>&lt;color&gt;</span></a>
   1.415 +
   1.416 +    <tr>
   1.417 +     <th>Initial:
   1.418 +
   1.419 +     <td><a
   1.420 +      href="http://www.w3.org/TR/css3-color/#currentcolor">currentColor</a>
   1.421 +
   1.422 +    <tr>
   1.423 +     <th>Applies to:
   1.424 +
   1.425 +     <td>all elements
   1.426 +
   1.427 +    <tr>
   1.428 +     <th>Inherited:
   1.429 +
   1.430 +     <td>no
   1.431 +
   1.432 +    <tr>
   1.433 +     <th>Percentages:
   1.434 +
   1.435 +     <td>N/A
   1.436 +
   1.437 +    <tr>
   1.438 +     <th>Media:
   1.439 +
   1.440 +     <td>visual
   1.441 +
   1.442 +    <tr>
   1.443 +     <th>Computed value:
   1.444 +
   1.445 +     <td>the computed color
   1.446 +  </table>
   1.447 +
   1.448 +  <p>This property specifies the color of text decoration (underlines
   1.449 +   overlines, and line-throughs) set on the element with ‘<a
   1.450 +   href="#text-decoration-line"><code
   1.451 +   class=property>text-decoration-line</code></a>’.
   1.452 +
   1.453 +  <h3 id=text-decoration-style-property><span class=secno>2.3. </span> Text
   1.454 +   Decoration Style: the ‘<a href="#text-decoration-style"><code
   1.455 +   class=property>text-decoration-style</code></a>’ property</h3>
   1.456 +
   1.457 +  <table class=propdef>
   1.458 +   <tbody>
   1.459 +    <tr>
   1.460 +     <th>Name:
   1.461 +
   1.462 +     <td><dfn id=text-decoration-style>text-decoration-style</dfn>
   1.463 +
   1.464 +    <tr>
   1.465 +     <th><a href="#values">Value</a>:
   1.466 +
   1.467 +     <td>solid | double | dotted | dashed | wavy
   1.468 +
   1.469 +    <tr>
   1.470 +     <th>Initial:
   1.471 +
   1.472 +     <td>solid
   1.473 +
   1.474 +    <tr>
   1.475 +     <th>Applies to:
   1.476 +
   1.477 +     <td>all elements
   1.478 +
   1.479 +    <tr>
   1.480 +     <th>Inherited:
   1.481 +
   1.482 +     <td>no
   1.483 +
   1.484 +    <tr>
   1.485 +     <th>Percentages:
   1.486 +
   1.487 +     <td>N/A
   1.488 +
   1.489 +    <tr>
   1.490 +     <th>Media:
   1.491 +
   1.492 +     <td>visual
   1.493 +
   1.494 +    <tr>
   1.495 +     <th>Computed value:
   1.496 +
   1.497 +     <td>as specified
   1.498 +  </table>
   1.499 +
   1.500 +  <p>This property specifies the style of the line(s) drawn for text
   1.501 +   decoration specified on the element. Values have the same meaning as for
   1.502 +   the <a
   1.503 +   href="http://www.w3.org/TR/css3-background/#the-border-style">border-style
   1.504 +   properties</a> <a href="#CSS3BG"
   1.505 +   rel=biblioentry>[CSS3BG]<!--{{!CSS3BG}}--></a>. ‘<code
   1.506 +   class=css>wavy</code>’ indicates a wavy line.
   1.507 +
   1.508 +  <h3 id=text-decoration-property><span class=secno>2.4. </span> Text
   1.509 +   Decoration Shorthand: the ‘<a href="#text-decoration"><code
   1.510 +   class=property>text-decoration</code></a>’ property</h3>
   1.511 +
   1.512 +  <table class=propdef>
   1.513 +   <tbody>
   1.514 +    <tr>
   1.515 +     <th>Name:
   1.516 +
   1.517 +     <td><dfn id=text-decoration>text-decoration</dfn>
   1.518 +
   1.519 +    <tr>
   1.520 +     <th><a href="#values">Value</a>:
   1.521 +
   1.522 +     <td><var><a
   1.523 +      href="#text-decoration-line">&lt;text-decoration-line&gt;</a></var> ||
   1.524 +      <var><a
   1.525 +      href="#text-decoration-style">&lt;text-decoration-style&gt;</a></var>
   1.526 +      || <var><a
   1.527 +      href="#text-decoration-color">&lt;text-decoration-color&gt;</a></var>
   1.528 +      || blink
   1.529 +
   1.530 +    <tr>
   1.531 +     <th>Initial:
   1.532 +
   1.533 +     <td>none
   1.534 +
   1.535 +    <tr>
   1.536 +     <th>Applies to:
   1.537 +
   1.538 +     <td>all elements
   1.539 +
   1.540 +    <tr>
   1.541 +     <th>Inherited:
   1.542 +
   1.543 +     <td>no
   1.544 +
   1.545 +    <tr>
   1.546 +     <th>Percentages:
   1.547 +
   1.548 +     <td>N/A
   1.549 +
   1.550 +    <tr>
   1.551 +     <th>Media:
   1.552 +
   1.553 +     <td>visual
   1.554 +
   1.555 +    <tr>
   1.556 +     <th>Computed value:
   1.557 +
   1.558 +     <td>as specified
   1.559 +  </table>
   1.560 +
   1.561 +  <p>This property is a shorthand for setting ‘<a
   1.562 +   href="#text-decoration-line"><code
   1.563 +   class=property>text-decoration-line</code></a>’, ‘<a
   1.564 +   href="#text-decoration-color"><code
   1.565 +   class=property>text-decoration-color</code></a>’, and ‘<a
   1.566 +   href="#text-decoration-style"><code
   1.567 +   class=property>text-decoration-style</code></a>’ in one declaration.
   1.568 +   Omitted values are set to their initial values. A ‘<a
   1.569 +   href="#text-decoration"><code class=property>text-decoration</code></a>’
   1.570 +   declaration that omits both the ‘<a href="#text-decoration-color"><code
   1.571 +   class=property>text-decoration-color</code></a>’ and ‘<a
   1.572 +   href="#text-decoration-style"><code
   1.573 +   class=property>text-decoration-style</code></a>’ values is
   1.574 +   backwards-compatible with CSS Levels 1 and 2.
   1.575 +
   1.576 +  <p>If the ‘<code class=css>blink</code>’ keyword is specified the text
   1.577 +   blinks (alternates between visible and invisible). Conforming user agents
   1.578 +   may simply not blink the text. Note that not blinking the text is one
   1.579 +   technique to satisfy <a
   1.580 +   href="http://www.w3.org/TR/UAAG/guidelines.html#tech-on-off-blinking-text">checkpoint
   1.581 +   3.3 of WAI-UAAG</a>.
   1.582 +
   1.583 +  <div class=example>
   1.584 +   <p>The following example underlines unvisited links with a solid blue
   1.585 +    underline in CSS1 and CSS2 UAs and a navy dotted underline in CSS3 UAs.
   1.586 +
   1.587 +   <pre><code class=css>
   1.588 +<!-- -->:link {
   1.589 +<!-- -->    color: blue;
   1.590 +<!-- -->    text-decoration: underline;
   1.591 +<!-- -->    text-decoration: navy dotted underline; /* <a
   1.592 +    href="http://www.w3.org/TR/CSS21/syndata.html#ignore">Ignored</a> in CSS1/CSS2 UAs */
   1.593 +<!-- -->}</code></pre>
   1.594 +  </div>
   1.595 +
   1.596 +  <h3 id=text-decoration-skip-property><span class=secno>2.5. </span> Text
   1.597 +   Decoration Line Continuity: the ‘<a href="#text-decoration-skip"><code
   1.598 +   class=property>text-decoration-skip</code></a>’ property</h3>
   1.599 +
   1.600 +  <table class=propdef>
   1.601 +   <tbody>
   1.602 +    <tr>
   1.603 +     <th>Name:
   1.604 +
   1.605 +     <td><dfn id=text-decoration-skip>text-decoration-skip</dfn>
   1.606 +
   1.607 +    <tr>
   1.608 +     <th><a href="#values">Value</a>:
   1.609 +
   1.610 +     <td>none | [ objects || spaces || ink || edges ]
   1.611 +
   1.612 +    <tr>
   1.613 +     <th>Initial:
   1.614 +
   1.615 +     <td>objects
   1.616 +
   1.617 +    <tr>
   1.618 +     <th>Applies to:
   1.619 +
   1.620 +     <td>all elements
   1.621 +
   1.622 +    <tr>
   1.623 +     <th>Inherited:
   1.624 +
   1.625 +     <td>yes
   1.626 +
   1.627 +    <tr>
   1.628 +     <th>Percentages:
   1.629 +
   1.630 +     <td>N/A
   1.631 +
   1.632 +    <tr>
   1.633 +     <th>Media:
   1.634 +
   1.635 +     <td>visual
   1.636 +
   1.637 +    <tr>
   1.638 +     <th>Computed value:
   1.639 +
   1.640 +     <td>as specified
   1.641 +  </table>
   1.642 +
   1.643 +  <p>This property specifies what parts of the element's content any text
   1.644 +   decoration affecting the element must skip over. It controls all text
   1.645 +   decoration lines drawn by the element and also any text decoration lines
   1.646 +   drawn by its ancestors. Values have the following meanings:
   1.647 +
   1.648 +  <dl>
   1.649 +   <dt><dfn id=none0 title="text-decoration-skip:none">‘<code
   1.650 +    class=css>none</code>’</dfn>
   1.651 +
   1.652 +   <dd>Skip nothing: text-decoration is drawn for all text content and for
   1.653 +    inline replaced elements.
   1.654 +
   1.655 +   <dt><dfn id=objects title="text-decoration-skip:objects">‘<code
   1.656 +    class=css>objects</code>’</dfn>
   1.657 +
   1.658 +   <dd>Skip this element if it is an atomic inline (such as an image or
   1.659 +    inline-block).
   1.660 +
   1.661 +   <dt><dfn id=spaces title="text-decoration-skip:spaces">‘<code
   1.662 +    class=css>spaces</code>’</dfn>
   1.663 +
   1.664 +   <dd>Skip white space: this includes regular spaces (U+0020) and tabs
   1.665 +    (U+0009), as well as nbsp (U+00A0), ideographic space (U+3000), all fixed
   1.666 +    width spaces (such as U+2000–U+200A, U+202F and U+205F), and any
   1.667 +    adjacent letter-spacing or word-spacing.
   1.668 +
   1.669 +   <dt><dfn id=ink title="text-decoration-skip:ink">‘<code
   1.670 +    class=css>ink</code>’</dfn>
   1.671 +
   1.672 +   <dd>Skip over where glyphs are drawn: interrupt the decoration line to let
   1.673 +    text show through where the text decoration would otherwise cross over a
   1.674 +    glyph. The UA may also skip a small distance to either side of the glyph
   1.675 +    outline.
   1.676 +
   1.677 +   <dt><dfn id=edges title="text-decoration-skip:edges">‘<code
   1.678 +    class=css>edges</code>’</dfn>
   1.679 +
   1.680 +   <dd>The UA should place the start and end of the line inwards from the
   1.681 +    content edge of the decorating element so that, e.g. two underlined
   1.682 +    elements side-by-side do not appear to have a single underline. (This is
   1.683 +    important in Chinese, where underlining is a form of punctuation.)
   1.684 +  </dl>
   1.685 +
   1.686 +  <p class=issue>Do we need a value that <em>doesn't</em> skip margins and
   1.687 +   padding?
   1.688 +
   1.689 +  <p class=note>Note that this property inherits and that descendant elements
   1.690 +   can have a different setting.
   1.691 +
   1.692 +  <h4 id=text-underline-position-property><span class=secno>2.5.1. </span>
   1.693 +   Text Underline Position: the ‘<a href="#text-underline-position"><code
   1.694 +   class=property>text-underline-position</code></a>’ property</h4>
   1.695 +
   1.696 +  <table class=propdef>
   1.697 +   <tbody>
   1.698 +    <tr>
   1.699 +     <th>Name:
   1.700 +
   1.701 +     <td><dfn id=text-underline-position>text-underline-position</dfn>
   1.702 +
   1.703 +    <tr>
   1.704 +     <th><a href="#values">Value</a>:
   1.705 +
   1.706 +     <td>auto | alphabetic | [ below || [ left | right ] ]
   1.707 +
   1.708 +    <tr>
   1.709 +     <th>Initial:
   1.710 +
   1.711 +     <td>auto
   1.712 +
   1.713 +    <tr>
   1.714 +     <th>Applies to:
   1.715 +
   1.716 +     <td>all elements
   1.717 +
   1.718 +    <tr>
   1.719 +     <th>Inherited:
   1.720 +
   1.721 +     <td>yes
   1.722 +
   1.723 +    <tr>
   1.724 +     <th>Percentages:
   1.725 +
   1.726 +     <td>N/A
   1.727 +
   1.728 +    <tr>
   1.729 +     <th>Media:
   1.730 +
   1.731 +     <td>visual
   1.732 +
   1.733 +    <tr>
   1.734 +     <th>Computed value:
   1.735 +
   1.736 +     <td>as specified
   1.737 +  </table>
   1.738 +
   1.739 +  <p>This property sets the position of an underline specified on the same
   1.740 +   element: it does not affect underlines specified by ancestor elements.
   1.741 +   Values have the following meanings:
   1.742 +
   1.743 +  <dl>
   1.744 +   <dt><dfn id=auto>‘<code class=css>auto</code>’</dfn>
   1.745 +
   1.746 +   <dd>The user agent may use any algorithm to determine the underline's
   1.747 +    position; however it must be placed at or below the alphabetic baseline.
   1.748 +    <p class=note>It is suggested that the underline position be ‘<a
   1.749 +     href="#alphabetic"><code class=css>alphabetic</code></a>’ unless it
   1.750 +     crosses either subscripted (or otherwise lowered) text, or it affects
   1.751 +     characters from Asian scripts such as Han or Tibetan, for which an
   1.752 +     alphabetic underline is too high: in such cases, aligning to the em box
   1.753 +     edge as described for ‘<code class=css>below left</code>’ is more
   1.754 +     appropriate.
   1.755 +
   1.756 +   <dt><dfn id=alphabetic>‘<code class=css>alphabetic</code>’</dfn>
   1.757 +
   1.758 +   <dd>The underline is positioned relative to the alphabetic baseline. In
   1.759 +    this case the underline is likely to cross some descenders.
   1.760 +    <div class=figure>
   1.761 +     <p><img
   1.762 +      alt="In a typical Latin font, the underline is positioned slightly                  below the alphabetic baseline, leaving a gap between the line                  and the bottom of most Latin letters, but crossing through                  descenders such as the stem of a 'p'."
   1.763 +      src=underline-position-alphabetic.png
   1.764 +      title="text-underline-position: alphabetic">
   1.765 +
   1.766 +     <p class=caption>‘<code class=css>text-underline-position:
   1.767 +      alphabetic</code>’
   1.768 +    </div>
   1.769 +
   1.770 +   <dt><dfn id=below>‘<code class=css>below</code>’</dfn>
   1.771 +
   1.772 +   <dd>In horizontal writing modes, the underline is positioned relative to
   1.773 +    the under edge of the element's content box. In this case the underline
   1.774 +    usually does not cross the descenders. (This is sometimes called
   1.775 +    "accounting" underline.) If the underline affects descendants with a
   1.776 +    lower content edge, the user agent should shift the underline down
   1.777 +    further to the lowest underlined content box edge. The user agent may
   1.778 +    ignore elements with ‘<code class=css>vertical-align</code>’ values
   1.779 +    given as lengths, percentages, ‘<code class=css>top</code>’, or
   1.780 +    ‘<code class=css>bottom</code>’ when making this adjustment. (Note
   1.781 +    that images that are not affected by the underline per ‘<a
   1.782 +    href="#text-decoration-skip"><code
   1.783 +    class=property>text-decoration-skip</code></a>’ will not affect the
   1.784 +    position of the underline.)
   1.785 +    <div class=figure>
   1.786 +     <p><img
   1.787 +      alt="In a typical Latin font, the underline is far enough                  below the text that it does not cross the bottom of a 'g'."
   1.788 +      src=underline-position-below.png
   1.789 +      title="text-underline-position: below">
   1.790 +
   1.791 +     <p class=caption>‘<code class=css>text-underline-position:
   1.792 +      below</code>’
   1.793 +    </div>
   1.794 +
   1.795 +    <div class=example>
   1.796 +     <p>Because ‘<a href="#text-underline-position"><code
   1.797 +      class=property>text-underline-position</code></a>’ inherits, and is
   1.798 +      not reset by the ‘<a href="#text-decoration"><code
   1.799 +      class=property>text-decoration</code></a>’ shorthand, the following
   1.800 +      example switches the document to use ‘<a href="#below"><code
   1.801 +      class=css>below</code></a>’ underlining, which can be more
   1.802 +      appropriate for writing systems with long, complicated descenders. It
   1.803 +      is also often useful for mathematical or chemical texts that use many
   1.804 +      subscripts.
   1.805 +
   1.806 +     <pre>:root { text-underline-position: below; }</pre>
   1.807 +    </div>
   1.808 +
   1.809 +   <dt><dfn id=left>‘<code class=css>left</code>’</dfn>
   1.810 +
   1.811 +   <dd>In vertical writing modes, the underline is aligned as for ‘<a
   1.812 +    href="#below"><code class=css>below</code></a>’, on the left edge of
   1.813 +    the text.
   1.814 +
   1.815 +   <dt><dfn id=right>‘<code class=css>right</code>’</dfn>
   1.816 +
   1.817 +   <dd>In vertical writing modes, the underline is aligned as for ‘<a
   1.818 +    href="#below"><code class=css>below</code></a>’, except it is aligned
   1.819 +    to the right edge of the text. If this causes the underline to be drawn
   1.820 +    on the "over" side of the text, then an overline also switches sides and
   1.821 +    is drawn on the "under" side.
   1.822 +  </dl>
   1.823 +
   1.824 +  <p>If ‘<a href="#below"><code class=css>below</code></a>’ is specified
   1.825 +   alone, ‘<a href="#left"><code class=css>left</code></a>’ is also
   1.826 +   implied. If ‘<a href="#left"><code class=css>left</code></a>’ or ‘<a
   1.827 +   href="#right"><code class=css>right</code></a>’ is specified alone,
   1.828 +   ‘<a href="#below"><code class=css>below</code></a>’ is also implied.
   1.829 +
   1.830 +  <p class=issue> Should ‘<code class=css>above</code>’/‘<a
   1.831 +   href="#below"><code class=css>below</code></a>’ be ‘<code
   1.832 +   class=css>over</code>’/‘<code class=css>under</code>’ to match text
   1.833 +   decoration names?
   1.834 +
   1.835 +  <div class=figure id=fig-text-underline-position>
   1.836 +   <table>
   1.837 +    <tbody>
   1.838 +     <tr>
   1.839 +      <td> <img
   1.840 +       alt="In mixed Japanese-Latin vertical text, 'text-underline-position: left'                     places the underline on the left side of the text."
   1.841 +       src=underline-position-left.png title="text-underline-position: left">
   1.842 +
   1.843 +      <td> <img
   1.844 +       alt="In mixed Japanese-Latin vertical text, 'text-underline-position: right'                     places the underline on the right side of the text."
   1.845 +       src=underline-position-right.png
   1.846 +       title="text-underline-position: right">
   1.847 +
   1.848 +     <tr>
   1.849 +      <td>‘<a href="#left"><code class=css>left</code></a>’
   1.850 +
   1.851 +      <td>‘<a href="#right"><code class=css>right</code></a>’
   1.852 +   </table>
   1.853 +
   1.854 +   <p class=caption>In vertical writing modes, the ‘<a
   1.855 +    href="#text-underline-position"><code
   1.856 +    class=property>text-underline-position</code></a>’ values ‘<a
   1.857 +    href="#left"><code class=css>left</code></a>’ and ‘<a
   1.858 +    href="#right"><code class=css>right</code></a>’ allow placing the
   1.859 +    underline on either side of the text. (In horizontal writing modes, both
   1.860 +    values are treated as ‘<a href="#below"><code
   1.861 +    class=css>below</code></a>’.)
   1.862 +  </div>
   1.863 +
   1.864 +  <div class=example>
   1.865 +   <p>The following example styles modern Chinese, Japanese, and Korean texts
   1.866 +    with the appropriate underline positions in both horizontal and vertical
   1.867 +    text:
   1.868 +
   1.869 +   <pre>:root:lang(ja), [lang|=ja], :root:lang(ko), [lang|=ko] { text-underline-position: below right; }
   1.870 +<!--   -->:root:lang(zh), [lang|=zh] { text-underline-position: below left; }</pre>
   1.871 +  </div>
   1.872 +
   1.873 +  <div class=note>
   1.874 +   <p>In some cases (such as in OpenType) the font format can offer
   1.875 +    information about the appropriate position of an underline. Typically
   1.876 +    this information gives the position of an ‘<a href="#alphabetic"><code
   1.877 +    class=css>alphabetic</code></a>’ underline; in some cases (especially
   1.878 +    in CJK fonts), it gives the position of a ‘<code class=css>below
   1.879 +    left</code>’ underline. (In this case, the font's underline metrics
   1.880 +    typically touch the bottom edge of the em box). The UA is encouraged to
   1.881 +    use information (such as the underline thickness, or appropriate
   1.882 +    alphabetic alignment) from the font wherever appropriate.
   1.883 +  </div>
   1.884 +
   1.885 +  <h3 id=emphasis-marks><span class=secno>2.6. </span> Emphasis Marks</h3>
   1.886 +
   1.887 +  <p>East Asian documents traditionally use small symbols next to each glyph
   1.888 +   to emphasize a run of text. For example:
   1.889 +
   1.890 +  <div class=figure>
   1.891 +   <p> <img alt="Example of emphasis in Japanese appearing above the text"
   1.892 +    class=example height=28 src=text-emphasis-ja.gif width=225>
   1.893 +
   1.894 +   <p class=caption>Accent emphasis (shown in blue for clarity) applied to
   1.895 +    Japanese text
   1.896 +  </div>
   1.897 +
   1.898 +  <h4 id=text-emphasis-style-property><span class=secno>2.6.1. </span>
   1.899 +   Emphasis Mark Style: the ‘<a href="#text-emphasis-style"><code
   1.900 +   class=property>text-emphasis-style</code></a>’ property</h4>
   1.901 +
   1.902 +  <table class=propdef>
   1.903 +   <tbody>
   1.904 +    <tr>
   1.905 +     <th>Name:
   1.906 +
   1.907 +     <td><dfn id=text-emphasis-style>text-emphasis-style</dfn>
   1.908 +
   1.909 +    <tr>
   1.910 +     <th><a href="#values">Value</a>:
   1.911 +
   1.912 +     <td>none | [ [ filled | open ] || [ dot | circle | double-circle |
   1.913 +      triangle | sesame ] ] | <a class=noxref
   1.914 +      href="http://www.w3.org/TR/CSS21/syndata.html#value-def-string"><span
   1.915 +      class=value-inst-string>&lt;string&gt;</span></a>
   1.916 +
   1.917 +    <tr>
   1.918 +     <th>Initial:
   1.919 +
   1.920 +     <td>none
   1.921 +
   1.922 +    <tr>
   1.923 +     <th>Applies to:
   1.924 +
   1.925 +     <td>all elements
   1.926 +
   1.927 +    <tr>
   1.928 +     <th>Inherited:
   1.929 +
   1.930 +     <td>yes
   1.931 +
   1.932 +    <tr>
   1.933 +     <th>Percentages:
   1.934 +
   1.935 +     <td>N/A
   1.936 +
   1.937 +    <tr>
   1.938 +     <th>Media:
   1.939 +
   1.940 +     <td>visual
   1.941 +
   1.942 +    <tr>
   1.943 +     <th>Computed value:
   1.944 +
   1.945 +     <td>‘<code class=property>none</code>’, a pair of keywords
   1.946 +      representing the shape and fill, or a string
   1.947 +  </table>
   1.948 +
   1.949 +  <p>This property applies emphasis marks to the element's text. Values have
   1.950 +   the following meanings:
   1.951 +
   1.952 +  <dl>
   1.953 +   <dt><dfn id=none1 title="text-emphasis:none">‘<code
   1.954 +    class=css>none</code>’</dfn>
   1.955 +
   1.956 +   <dd>No emphasis marks.
   1.957 +
   1.958 +   <dt><dfn id=filled title="text-emphasis:filled">‘<code
   1.959 +    class=css>filled</code>’</dfn>
   1.960 +
   1.961 +   <dd>The shape is filled with solid color.
   1.962 +
   1.963 +   <dt><dfn id=open title="text-emphasis:open">‘<code
   1.964 +    class=css>open</code>’</dfn>
   1.965 +
   1.966 +   <dd>The shape is hollow.
   1.967 +
   1.968 +   <dt><dfn id=dot title="text-emphasis:dot">‘<code
   1.969 +    class=css>dot</code>’</dfn>
   1.970 +
   1.971 +   <dd>Display small circles as marks. The filled dot is U+2022 ‘<code
   1.972 +    class=css>•</code>’, and the open dot is U+25E6 ‘<code
   1.973 +    class=css>◦</code>’.
   1.974 +
   1.975 +   <dt><dfn id=circle title="text-emphasis:circle">‘<code
   1.976 +    class=css>circle</code>’</dfn>
   1.977 +
   1.978 +   <dd>Display large circles as marks. The filled circle is U+25CF ‘<code
   1.979 +    class=css>●</code>’, and the open circle is U+25CB ‘<code
   1.980 +    class=css>○</code>’.
   1.981 +
   1.982 +   <dt><dfn id=double-circle title="text-emphasis:double-circle">‘<code
   1.983 +    class=css>double-circle</code>’</dfn>
   1.984 +
   1.985 +   <dd>Display double circles as marks. The filled double-circle is U+25C9
   1.986 +    ‘<code class=css>◉</code>’, and the open double-circle is U+25CE
   1.987 +    ‘<code class=css>◎</code>’.
   1.988 +
   1.989 +   <dt><dfn id=triangle title="text-emphasis:triangle">‘<code
   1.990 +    class=css>triangle</code>’</dfn>
   1.991 +
   1.992 +   <dd>Display triangles as marks. The filled triangle is U+25B2 ‘<code
   1.993 +    class=css>▲</code>’, and the open triangle is U+25B3 ‘<code
   1.994 +    class=css>△</code>’.
   1.995 +
   1.996 +   <dt><dfn id=sesame title="text-emphasis:sesame">‘<code
   1.997 +    class=css>sesame</code>’</dfn>
   1.998 +
   1.999 +   <dd>Display sesames as marks. The filled sesame is U+FE45 ‘<code
  1.1000 +    class=css>﹅</code>’, and the open sesame is U+FE46 ‘<code
  1.1001 +    class=css>﹆</code>’.
  1.1002 +
  1.1003 +   <dt><dfn id=ltstringgt title="text-emphasis:sesame">‘<code
  1.1004 +    class=css><var>&lt;string&gt;</var></code>’</dfn>
  1.1005 +
  1.1006 +   <dd>Display the given string as marks. Authors should not specify more
  1.1007 +    than one <a href="#character"><i>character</i></a> in &lt;string&gt;. The
  1.1008 +    UA may truncate or ignore strings consisting of more than one grapheme
  1.1009 +    cluster.
  1.1010 +  </dl>
  1.1011 +
  1.1012 +  <p>If a shape keyword is specified but neither of ‘<code
  1.1013 +   class=css>filled</code>’ nor ‘<code class=css>open</code>’ is
  1.1014 +   specified, ‘<code class=css>filled</code>’ is assumed. If only
  1.1015 +   ‘<code class=css>filled</code>’ or ‘<code class=css>open</code>’
  1.1016 +   is specified, the shape keyword computes to ‘<code
  1.1017 +   class=css>circle</code>’ in horizontal writing mode and ‘<code
  1.1018 +   class=css>sesame</code>’ in vertical writing mode.
  1.1019 +
  1.1020 +  <p>The marks should be drawn using the element's font settings with its
  1.1021 +   size scaled down to 50%. However, not all fonts have all these glyphs, and
  1.1022 +   some fonts use inappropriate sizes for emphasis marks in these code
  1.1023 +   points. The UA may opt to use a font known to be good for emphasis marks,
  1.1024 +   or the marks may instead be synthesized by the UA. Marks must remain
  1.1025 +   upright in vertical writing modes: like CJK characters, they do not rotate
  1.1026 +   to match the writing mode.
  1.1027 +
  1.1028 +  <p class=note> One example of good fonts for emphasis marks is Adobe's
  1.1029 +   opensource project, <a
  1.1030 +   href="http://sourceforge.net/adobe/kenten-generic/">Kenten Generic
  1.1031 +   OpenType Font</a>, which is specially designed for the emphasis marks.
  1.1032 +
  1.1033 +  <p>The marks are drawn once for each <a
  1.1034 +   href="#character"><i>character</i></a>. However, emphasis marks are not
  1.1035 +   drawn for characters that are:
  1.1036 +
  1.1037 +  <ul>
  1.1038 +   <li><a href="http://www.w3.org/TR/css3-text/#word-separator">Word
  1.1039 +    separators</a> or that belong to the Unicode separator classes (Z*). (But
  1.1040 +    note that emphasis marks <em>are</em> drawn for a space that combines
  1.1041 +    with any combining characters.)
  1.1042 +
  1.1043 +   <li>Characters belonging to the Unicode classes for control codes and
  1.1044 +    unassigned characters (Cc, Cf, Cn).
  1.1045 +  </ul>
  1.1046 +
  1.1047 +  <p>If emphasis marks are drawn for characters for which ruby is drawn in
  1.1048 +   the same position as the emphasis mark, the ruby should be stacked between
  1.1049 +   the emphasis marks and the base text. In this case, the position of the
  1.1050 +   emphasis marks for a given element should be determined as if all
  1.1051 +   characters have ruby boxes of the same height as the highest ruby box in
  1.1052 +   the element. If the UA is not capable of drawing ruby and emphasis marks
  1.1053 +   on the same side, the UA may hide ruby and draw only emphasis marks.
  1.1054 +
  1.1055 +  <div class=figure>
  1.1056 +   <p><img
  1.1057 +    alt="Example of emphasis marks applied to 4 characters, and ruby to 2 of them"
  1.1058 +    height=50 src=text-emphasis-ruby.png width=134>
  1.1059 +
  1.1060 +   <p class=caption>Emphasis marks applied to 4 characters, and ruby to 2 of
  1.1061 +    them
  1.1062 +  </div>
  1.1063 +
  1.1064 +  <p class=note>A future level of CSS may define controls to specify what to
  1.1065 +   do when emphasis marks and ruby text coincide.
  1.1066 +
  1.1067 +  <h4 id=text-emphasis-color-property><span class=secno>2.6.2. </span>
  1.1068 +   Emphasis Mark Color: the ‘<a href="#text-emphasis-color"><code
  1.1069 +   class=property>text-emphasis-color</code></a>’ property</h4>
  1.1070 +
  1.1071 +  <table class=propdef>
  1.1072 +   <tbody>
  1.1073 +    <tr>
  1.1074 +     <th>Name:
  1.1075 +
  1.1076 +     <td><dfn id=text-emphasis-color>text-emphasis-color</dfn>
  1.1077 +
  1.1078 +    <tr>
  1.1079 +     <th><a href="#values">Value</a>:
  1.1080 +
  1.1081 +     <td>&lt;color&gt;
  1.1082 +
  1.1083 +    <tr>
  1.1084 +     <th>Initial:
  1.1085 +
  1.1086 +     <td><a
  1.1087 +      href="http://www.w3.org/TR/css3-color/#currentcolor">currentColor</a>
  1.1088 +
  1.1089 +    <tr>
  1.1090 +     <th>Applies to:
  1.1091 +
  1.1092 +     <td>all elements
  1.1093 +
  1.1094 +    <tr>
  1.1095 +     <th>Inherited:
  1.1096 +
  1.1097 +     <td>yes
  1.1098 +
  1.1099 +    <tr>
  1.1100 +     <th>Percentages:
  1.1101 +
  1.1102 +     <td>N/A
  1.1103 +
  1.1104 +    <tr>
  1.1105 +     <th>Media:
  1.1106 +
  1.1107 +     <td>visual
  1.1108 +
  1.1109 +    <tr>
  1.1110 +     <th>Computed value:
  1.1111 +
  1.1112 +     <td>as specified
  1.1113 +  </table>
  1.1114 +
  1.1115 +  <p>This property specifies the foreground color of the emphasis marks.
  1.1116 +
  1.1117 +  <p class=note> The correct behavior of this property depends on an
  1.1118 +   outstanding erratum on <a href="#CSS3COLOR"
  1.1119 +   rel=biblioentry>[CSS3COLOR]<!--{{CSS3COLOR}}--></a> that has the ‘<a
  1.1120 +   href="#currentcolor"><code class=css>currentColor</code></a>’ keyword
  1.1121 +   inherit as itself, and to take the value of the ‘<code
  1.1122 +   class=property>color</code>’ property as its <em>used</em> (not
  1.1123 +   computed) value.
  1.1124 +
  1.1125 +  <h4 id=text-emphasis-property><span class=secno>2.6.3. </span> Emphasis
  1.1126 +   Mark Shorthand: the ‘<a href="#text-emphasis"><code
  1.1127 +   class=property>text-emphasis</code></a>’ property</h4>
  1.1128 +
  1.1129 +  <table class=propdef>
  1.1130 +   <tbody>
  1.1131 +    <tr>
  1.1132 +     <th>Name:
  1.1133 +
  1.1134 +     <td><dfn id=text-emphasis>text-emphasis</dfn>
  1.1135 +
  1.1136 +    <tr>
  1.1137 +     <th><a href="#values">Value</a>:
  1.1138 +
  1.1139 +     <td>‘<code class=css>&lt;<a
  1.1140 +      href="#text-emphasis-style">text-emphasis-style</a>&gt;</code>’ ||
  1.1141 +      ‘<code class=css>&lt;<a
  1.1142 +      href="#text-emphasis-color">text-emphasis-color</a>&gt;</code>’
  1.1143 +
  1.1144 +    <tr>
  1.1145 +     <th>Initial:
  1.1146 +
  1.1147 +     <td>see individual properties
  1.1148 +
  1.1149 +    <tr>
  1.1150 +     <th>Applies to:
  1.1151 +
  1.1152 +     <td>all elements
  1.1153 +
  1.1154 +    <tr>
  1.1155 +     <th>Inherited:
  1.1156 +
  1.1157 +     <td>yes
  1.1158 +
  1.1159 +    <tr>
  1.1160 +     <th>Percentages:
  1.1161 +
  1.1162 +     <td>N/A
  1.1163 +
  1.1164 +    <tr>
  1.1165 +     <th>Media:
  1.1166 +
  1.1167 +     <td>visual
  1.1168 +
  1.1169 +    <tr>
  1.1170 +     <th>Computed value:
  1.1171 +
  1.1172 +     <td>see individual properties
  1.1173 +  </table>
  1.1174 +
  1.1175 +  <p>This property is a shorthand for setting ‘<a
  1.1176 +   href="#text-emphasis-style"><code
  1.1177 +   class=property>text-emphasis-style</code></a>’ and ‘<a
  1.1178 +   href="#text-emphasis-color"><code
  1.1179 +   class=property>text-emphasis-color</code></a>’ in one declaration.
  1.1180 +   Omitted values are set to their initial values.
  1.1181 +
  1.1182 +  <p class=note>Note that ‘<a href="#text-emphasis-position"><code
  1.1183 +   class=property>text-emphasis-position</code></a>’ is not reset in this
  1.1184 +   shorthand. This is because typically the shape and color vary, but the
  1.1185 +   position is consistent for a particular language throughout the document.
  1.1186 +   Therefore the position should inherit independently.
  1.1187 +
  1.1188 +  <h4 id=text-emphasis-position-property><span class=secno>2.6.4. </span>
  1.1189 +   Emphasis Mark Position: the ‘<a href="#text-emphasis-position"><code
  1.1190 +   class=property>text-emphasis-position</code></a>’ property</h4>
  1.1191 +
  1.1192 +  <table class=propdef>
  1.1193 +   <tbody>
  1.1194 +    <tr>
  1.1195 +     <th>Name:
  1.1196 +
  1.1197 +     <td><dfn id=text-emphasis-position>text-emphasis-position</dfn>
  1.1198 +
  1.1199 +    <tr>
  1.1200 +     <th><a href="#values">Value</a>:
  1.1201 +
  1.1202 +     <td>[ above | below ] && [ right | left ]
  1.1203 +
  1.1204 +    <tr>
  1.1205 +     <th>Initial:
  1.1206 +
  1.1207 +     <td>above right
  1.1208 +
  1.1209 +    <tr>
  1.1210 +     <th>Applies to:
  1.1211 +
  1.1212 +     <td>all elements
  1.1213 +
  1.1214 +    <tr>
  1.1215 +     <th>Inherited:
  1.1216 +
  1.1217 +     <td>yes
  1.1218 +
  1.1219 +    <tr>
  1.1220 +     <th>Percentages:
  1.1221 +
  1.1222 +     <td>N/A
  1.1223 +
  1.1224 +    <tr>
  1.1225 +     <th>Media:
  1.1226 +
  1.1227 +     <td>visual
  1.1228 +
  1.1229 +    <tr>
  1.1230 +     <th>Computed value:
  1.1231 +
  1.1232 +     <td>as specified
  1.1233 +  </table>
  1.1234 +
  1.1235 +  <p>This property describes where emphasis marks are drawn at. The values
  1.1236 +   have following meanings:
  1.1237 +
  1.1238 +  <dl>
  1.1239 +   <dt><dfn id=above title="text-emphasis:above">‘<code
  1.1240 +    class=css>above</code>’</dfn>
  1.1241 +
  1.1242 +   <dd>Draw marks over the text in horizontal writing mode.
  1.1243 +
  1.1244 +   <dt><dfn id=below0 title="text-emphasis:below">‘<code
  1.1245 +    class=css>below</code>’</dfn>
  1.1246 +
  1.1247 +   <dd>Draw marks under the text in horizontal writing mode.
  1.1248 +
  1.1249 +   <dt><dfn id=right0 title="text-emphasis:right">‘<code
  1.1250 +    class=css>right</code>’</dfn>
  1.1251 +
  1.1252 +   <dd>Draw marks to the right of the text in vertical writing mode.
  1.1253 +
  1.1254 +   <dt><dfn id=left0 title="text-emphasis:left">‘<code
  1.1255 +    class=css>left</code>’</dfn>
  1.1256 +
  1.1257 +   <dd>Draw marks to the left of the text in vertical writing mode.
  1.1258 +  </dl>
  1.1259 +
  1.1260 +  <p class=issue> Should ‘<code class=css>above</code>’/‘<a
  1.1261 +   href="#below"><code class=css>below</code></a>’ be ‘<code
  1.1262 +   class=css>over</code>’/‘<code class=css>under</code>’ to match text
  1.1263 +   decoration names?
  1.1264 +
  1.1265 +  <p>Emphasis marks are drawn exactly as if each character was assigned the
  1.1266 +   mark as its ruby annotation text with the ruby position given by ‘<a
  1.1267 +   href="#text-emphasis-position"><code
  1.1268 +   class=property>text-emphasis-position</code></a>’ and the ruby alignment
  1.1269 +   as centered.
  1.1270 +
  1.1271 +  <p>The effect of emphasis marks on the line height is the same as for ruby
  1.1272 +   text.
  1.1273 +
  1.1274 +  <div class=note>
  1.1275 +   <p>Note, the preferred position of emphasis marks depends on the language.
  1.1276 +    In Japanese for example, the preferred position is ‘<code
  1.1277 +    class=css>above right</code>’. In Chinese, on the other hand, the
  1.1278 +    preferred position is ‘<code class=css>below right</code>’. The
  1.1279 +    informative table below summarizes the preferred emphasis mark positions
  1.1280 +    for Chinese and Japanese:
  1.1281 +
  1.1282 +   <table class=data>
  1.1283 +    <caption>Preferred emphasis mark and ruby position</caption>
  1.1284 +
  1.1285 +    <thead>
  1.1286 +     <tr>
  1.1287 +      <th rowspan=2 scope=col>Language
  1.1288 +
  1.1289 +      <th colspan=2 scope=col>Preferred mark position
  1.1290 +
  1.1291 +      <th colspan=2 rowspan=2 scope=col>Illustration
  1.1292 +
  1.1293 +     <tr>
  1.1294 +      <th>Horizontal
  1.1295 +
  1.1296 +      <th>Vertical
  1.1297 +
  1.1298 +    <tbody>
  1.1299 +     <tr>
  1.1300 +      <td scope=row>Japanese
  1.1301 +
  1.1302 +      <td>above
  1.1303 +
  1.1304 +      <td>right
  1.1305 +
  1.1306 +      <td> <img
  1.1307 +       alt="Emphasis marks appear above each emphasized character in horizontal Japanese text."
  1.1308 +       height=28 src=text-emphasis-ja.gif
  1.1309 +       title="Emphasis (shown in blue for clarity) applied above a fragment of Japanese text"
  1.1310 +       width=225>
  1.1311 +
  1.1312 +      <td rowspan=2> <img
  1.1313 +       alt="Emphasis marks appear on the right of each emphasized character in vertical Japanese text."
  1.1314 +       height=89 src=text-emphasis-v.gif
  1.1315 +       title="Emphasis applied on the right of a fragment of Japanese text"
  1.1316 +       width=34> <!--
  1.1317 +        <tr>
  1.1318 +          <td scope="row">Mongolian
  1.1319 +          <td><span class="issue">?</span>
  1.1320 +          <td>right
  1.1321 +        -->
  1.1322 +
  1.1323 +     <tr>
  1.1324 +      <td scope=row>Chinese
  1.1325 +
  1.1326 +      <td>below
  1.1327 +
  1.1328 +      <td>right
  1.1329 +
  1.1330 +      <td> <img
  1.1331 +       alt="Emphasis marks appear below each emphasized character in horizontal Simplified Chinese text."
  1.1332 +       height=28 src=text-emphasis-zh.gif
  1.1333 +       title="Emphasis (shown in blue for clarity) applied below a fragment of Chinese text"
  1.1334 +       width=133>
  1.1335 +   </table>
  1.1336 +  </div>
  1.1337 +
  1.1338 +  <h3 id=text-shadow-property><span class=secno>2.7. </span> Text Shadows:
  1.1339 +   the ‘<a href="#text-shadow"><code
  1.1340 +   class=property>text-shadow</code></a>’ property</h3>
  1.1341 +
  1.1342 +  <table class=propdef>
  1.1343 +   <tbody>
  1.1344 +    <tr>
  1.1345 +     <th>Name:
  1.1346 +
  1.1347 +     <td><dfn id=text-shadow>text-shadow</dfn>
  1.1348 +
  1.1349 +    <tr>
  1.1350 +     <th><a href="#values">Value</a>:
  1.1351 +
  1.1352 +     <td>none | [ &lt;length>{2,3} && &lt;color>? ]#
  1.1353 +
  1.1354 +    <tr>
  1.1355 +     <th>Initial:
  1.1356 +
  1.1357 +     <td>none
  1.1358 +
  1.1359 +    <tr>
  1.1360 +     <th>Applies to:
  1.1361 +
  1.1362 +     <td>all elements
  1.1363 +
  1.1364 +    <tr>
  1.1365 +     <th>Inherited:
  1.1366 +
  1.1367 +     <td>yes
  1.1368 +
  1.1369 +    <tr>
  1.1370 +     <th>Percentages:
  1.1371 +
  1.1372 +     <td>N/A
  1.1373 +
  1.1374 +    <tr>
  1.1375 +     <th>Media:
  1.1376 +
  1.1377 +     <td>visual
  1.1378 +
  1.1379 +    <tr>
  1.1380 +     <th>Computed value:
  1.1381 +
  1.1382 +     <td>a color plus three absolute &lt;length&gt;s
  1.1383 +  </table>
  1.1384 +
  1.1385 +  <p>This property accepts a comma-separated list of shadow effects to be
  1.1386 +   applied to the text of the element. Values are interpreted as for <a
  1.1387 +   href="http://www.w3.org/TR/css3-background/#the-box-shadow">‘<code
  1.1388 +   class=property>box-shadow</code>’</a> <a href="#CSS3BG"
  1.1389 +   rel=biblioentry>[CSS3BG]<!--{{!CSS3BG}}--></a>. (But note that spread
  1.1390 +   values are not allowed.) The shadow is applied to all of the element's
  1.1391 +   text as well as any text decorations it specifies.
  1.1392 +
  1.1393 +  <p>The shadow effects are applied front-to-back: the first shadow is on
  1.1394 +   top. The shadows may thus overlay each other, but they never overlay the
  1.1395 +   text itself. The shadow must be painted at a stack level between the
  1.1396 +   element's border and/or background, if present, and the elements text and
  1.1397 +   text decoration. UAs should avoid painting text shadows over text in
  1.1398 +   adjacent elements belonging to the same stack level and stacking context.
  1.1399 +   (This may mean that the exact stack level of the shadows depends on
  1.1400 +   whether the element has a border or background: the exact stacking
  1.1401 +   behavior of text shadows is thus UA-defined.)
  1.1402 +
  1.1403 +  <p>Unlike ‘<code class=property>box-shadow</code>’, text shadows are
  1.1404 +   not clipped to the shadowed shape and may show through if the text is
  1.1405 +   partially-transparent. Like ‘<code class=property>box-shadow</code>’,
  1.1406 +   text shadows do not influence layout, and do not trigger scrolling or
  1.1407 +   increase the size of the scrollable area.
  1.1408 +
  1.1409 +  <p class=note>The painting order of shadows defined here is the opposite of
  1.1410 +   that defined in the 1998 <a
  1.1411 +   href="http://www.w3.org/TR/1998/REC-CSS2-19980512">CSS2
  1.1412 +   Recommendation</a>.
  1.1413 +
  1.1414 +  <p>The ‘<a href="#text-shadow"><code class=css>text-shadow</code></a>’
  1.1415 +   property applies to both the <code>::first-line</code> and
  1.1416 +   <code>::first-letter</code> pseudo-elements.
  1.1417 +
  1.1418 +  <h2 id=conformance><span class=secno>3. </span> Conformance</h2>
  1.1419 +
  1.1420 +  <h3 id=conventions><span class=secno>3.1. </span> Document Conventions</h3>
  1.1421 +
  1.1422 +  <p>Conformance requirements are expressed with a combination of descriptive
  1.1423 +   assertions and RFC 2119 terminology. The key words “MUST”, “MUST
  1.1424 +   NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”,
  1.1425 +   “SHOULD NOT”, “RECOMMENDED”, “MAY”, and “OPTIONAL” in the
  1.1426 +   normative parts of this document are to be interpreted as described in RFC
  1.1427 +   2119. However, for readability, these words do not appear in all uppercase
  1.1428 +   letters in this specification.
  1.1429 +
  1.1430 +  <p>All of the text of this specification is normative except sections
  1.1431 +   explicitly marked as non-normative, examples, and notes. <a
  1.1432 +   href="#RFC2119" rel=biblioentry>[RFC2119]<!--{{!RFC2119}}--></a>
  1.1433 +
  1.1434 +  <p>Examples in this specification are introduced with the words “for
  1.1435 +   example” or are set apart from the normative text with
  1.1436 +   <code>class="example"</code>, like this:
  1.1437 +
  1.1438 +  <div class=example>
  1.1439 +   <p>This is an example of an informative example.
  1.1440 +  </div>
  1.1441 +
  1.1442 +  <p>Informative notes begin with the word “Note” and are set apart from
  1.1443 +   the normative text with <code>class="note"</code>, like this:
  1.1444 +
  1.1445 +  <p class=note>Note, this is an informative note.
  1.1446 +
  1.1447 +  <h3 id=conformance-classes><span class=secno>3.2. </span> Conformance
  1.1448 +   Classes</h3>
  1.1449 +
  1.1450 +  <p>Conformance to CSS Text Level 3 is defined for three conformance
  1.1451 +   classes:
  1.1452 +
  1.1453 +  <dl>
  1.1454 +   <dt><dfn id=style-sheet title="style sheet!!as conformance class">style
  1.1455 +    sheet</dfn>
  1.1456 +
  1.1457 +   <dd>A <a href="http://www.w3.org/TR/CSS21/conform.html#style-sheet">CSS
  1.1458 +    style sheet</a>.
  1.1459 +
  1.1460 +   <dt><dfn id=renderer>renderer</dfn>
  1.1461 +
  1.1462 +   <dd>A <a href="http://www.w3.org/TR/CSS21/conform.html#user-agent">UA</a>
  1.1463 +    that interprets the semantics of a style sheet and renders documents that
  1.1464 +    use them.
  1.1465 +
  1.1466 +   <dt><dfn id=authoring-tool>authoring tool</dfn>
  1.1467 +
  1.1468 +   <dd>A <a href="http://www.w3.org/TR/CSS21/conform.html#user-agent">UA</a>
  1.1469 +    that writes a style sheet.
  1.1470 +  </dl>
  1.1471 +
  1.1472 +  <p>A style sheet is conformant to CSS Text Level 3 if all of its
  1.1473 +   declarations that use properties defined in this module have values that
  1.1474 +   are valid according to the generic CSS grammar and the individual grammars
  1.1475 +   of each property as given in this module.
  1.1476 +
  1.1477 +  <p>A renderer is conformant to CSS Text Level 3 if, in addition to
  1.1478 +   interpreting the style sheet as defined by the appropriate specifications,
  1.1479 +   it supports all the features defined by CSS Text Level 3 by parsing them
  1.1480 +   correctly and rendering the document accordingly. However, the inability
  1.1481 +   of a UA to correctly render a document due to limitations of the device
  1.1482 +   does not make the UA non-conformant. (For example, a UA is not required to
  1.1483 +   render color on a monochrome monitor.)
  1.1484 +
  1.1485 +  <p>An authoring tool is conformant to CSS Text Level 3 if it writes style
  1.1486 +   sheets that are syntactically correct according to the generic CSS grammar
  1.1487 +   and the individual grammars of each feature in this module, and meet all
  1.1488 +   other conformance requirements of style sheets as described in this
  1.1489 +   module.
  1.1490 +
  1.1491 +  <h3 id=partial><span class=secno>3.3. </span> Partial Implementations</h3>
  1.1492 +
  1.1493 +  <p>So that authors can exploit the forward-compatible parsing rules to
  1.1494 +   assign fallback values, CSS renderers <strong>must</strong> treat as
  1.1495 +   invalid (and <a
  1.1496 +   href="http://www.w3.org/TR/CSS21/conform.html#ignore">ignore as
  1.1497 +   appropriate</a>) any at-rules, properties, property values, keywords, and
  1.1498 +   other syntactic constructs for which they have no usable level of support.
  1.1499 +   In particular, user agents <strong>must not</strong> selectively ignore
  1.1500 +   unsupported component values and honor supported values in a single
  1.1501 +   multi-value property declaration: if any value is considered invalid (as
  1.1502 +   unsupported values must be), CSS requires that the entire declaration be
  1.1503 +   ignored.
  1.1504 +
  1.1505 +  <h3 id=experimental><span class=secno>3.4. </span> Experimental
  1.1506 +   Implementations</h3>
  1.1507 +
  1.1508 +  <p>To avoid clashes with future CSS features, the CSS2.1 specification
  1.1509 +   reserves a <a
  1.1510 +   href="http://www.w3.org/TR/CSS21/syndata.html#vendor-keywords">prefixed
  1.1511 +   syntax</a> for proprietary and experimental extensions to CSS.
  1.1512 +
  1.1513 +  <p>Prior to a specification reaching the Candidate Recommendation stage in
  1.1514 +   the W3C process, all implementations of a CSS feature are considered
  1.1515 +   experimental. The CSS Working Group recommends that implementations use a
  1.1516 +   vendor-prefixed syntax for such features, including those in W3C Working
  1.1517 +   Drafts. This avoids incompatibilities with future changes in the draft.
  1.1518 +
  1.1519 +  <h3 id=testing><span class=secno>3.5. </span>Non-Experimental
  1.1520 +   Implementations</h3>
  1.1521 +
  1.1522 +  <p>Once a specification reaches the Candidate Recommendation stage,
  1.1523 +   non-experimental implementations are possible, and implementors should
  1.1524 +   release an unprefixed implementation of any CR-level feature they can
  1.1525 +   demonstrate to be correctly implemented according to spec.
  1.1526 +
  1.1527 +  <p>To establish and maintain the interoperability of CSS across
  1.1528 +   implementations, the CSS Working Group requests that non-experimental CSS
  1.1529 +   renderers submit an implementation report (and, if necessary, the
  1.1530 +   testcases used for that implementation report) to the W3C before releasing
  1.1531 +   an unprefixed implementation of any CSS features. Testcases submitted to
  1.1532 +   W3C are subject to review and correction by the CSS Working Group.
  1.1533 +
  1.1534 +  <p>Further information on submitting testcases and implementation reports
  1.1535 +   can be found from on the CSS Working Group's website at <a
  1.1536 +   href="http://www.w3.org/Style/CSS/Test/">http://www.w3.org/Style/CSS/Test/</a>.
  1.1537 +   Questions should be directed to the <a
  1.1538 +   href="http://lists.w3.org/Archives/Public/public-css-testsuite">public-css-testsuite@w3.org</a>
  1.1539 +   mailing list.
  1.1540 +
  1.1541 +  <h3 id=cr-exit-criteria><span class=secno>3.6. </span> CR Exit Criteria</h3>
  1.1542 +
  1.1543 +  <p> For this specification to be advanced to Proposed Recommendation, there
  1.1544 +   must be at least two independent, interoperable implementations of each
  1.1545 +   feature. Each feature may be implemented by a different set of products,
  1.1546 +   there is no requirement that all features be implemented by a single
  1.1547 +   product. For the purposes of this criterion, we define the following
  1.1548 +   terms:
  1.1549 +
  1.1550 +  <dl>
  1.1551 +   <dt>independent
  1.1552 +
  1.1553 +   <dd>each implementation must be developed by a different party and cannot
  1.1554 +    share, reuse, or derive from code used by another qualifying
  1.1555 +    implementation. Sections of code that have no bearing on the
  1.1556 +    implementation of this specification are exempt from this requirement.
  1.1557 +
  1.1558 +   <dt>interoperable
  1.1559 +
  1.1560 +   <dd>passing the respective test case(s) in the official CSS test suite,
  1.1561 +    or, if the implementation is not a Web browser, an equivalent test. Every
  1.1562 +    relevant test in the test suite should have an equivalent test created if
  1.1563 +    such a user agent (UA) is to be used to claim interoperability. In
  1.1564 +    addition if such a UA is to be used to claim interoperability, then there
  1.1565 +    must one or more additional UAs which can also pass those equivalent
  1.1566 +    tests in the same way for the purpose of interoperability. The equivalent
  1.1567 +    tests must be made publicly available for the purposes of peer review.
  1.1568 +
  1.1569 +   <dt>implementation
  1.1570 +
  1.1571 +   <dd>a user agent which:
  1.1572 +    <ol class=inline>
  1.1573 +     <li>implements the specification.
  1.1574 +
  1.1575 +     <li>is available to the general public. The implementation may be a
  1.1576 +      shipping product or other publicly available version (i.e., beta
  1.1577 +      version, preview release, or “nightly build”). Non-shipping product
  1.1578 +      releases must have implemented the feature(s) for a period of at least
  1.1579 +      one month in order to demonstrate stability.
  1.1580 +
  1.1581 +     <li>is not experimental (i.e., a version specifically designed to pass
  1.1582 +      the test suite and is not intended for normal usage going forward).
  1.1583 +    </ol>
  1.1584 +  </dl>
  1.1585 +
  1.1586 +  <p>The specification will remain Candidate Recommendation for at least six
  1.1587 +   months.
  1.1588 +
  1.1589 +  <h2 class=no-num id=acknowledgements> Appendix A: Acknowledgements</h2>
  1.1590 +
  1.1591 +  <p>This specification would not have been possible without the help from:
  1.1592 +   Ayman Aldahleh, Bert Bos, Tantek Çelik, Stephen Deach, John Daggett,
  1.1593 +   Martin Dürst, Laurie Anna Edlund, Ben Errez, Yaniv Feinberg, Arye
  1.1594 +   Gittelman, Ian Hickson, Martin Heijdra, Richard Ishida, Masayasu Ishikawa,
  1.1595 +   Michael Jochimsen, Eric LeVine, Ambrose Li, Håkon Wium Lie, Chris Lilley,
  1.1596 +   Ken Lunde, Nat McCully, Shinyu Murakami, Paul Nelson, Chris Pratley,
  1.1597 +   Marcin Sawicki, Arnold Schrijver, Rahul Sonnad, Michel Suignard, Takao
  1.1598 +   Suzuki, Frank Tang, Chris Thrasher, Etan Wexler, Chris Wilson, Masafumi
  1.1599 +   Yabe and Steve Zilles.
  1.1600 +
  1.1601 +  <h2 class=no-num id=appendix-b-references>Appendix B: References</h2>
  1.1602 +
  1.1603 +  <h3 class=no-num id=normative-ref>Normative references</h3>
  1.1604 +  <!--begin-normative-->
  1.1605 +  <!-- Sorted by label -->
  1.1606 +
  1.1607 +  <dl class=bibliography>
  1.1608 +   <dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
  1.1609 +    <!---->
  1.1610 +
  1.1611 +   <dt id=CSS21>[CSS21]
  1.1612 +
  1.1613 +   <dd>Bert Bos; et al. <a
  1.1614 +    href="http://www.w3.org/TR/2011/REC-CSS2-20110607"><cite>Cascading Style
  1.1615 +    Sheets Level 2 Revision 1 (CSS 2.1) Specification.</cite></a> 7 June
  1.1616 +    2011. W3C Recommendation. URL: <a
  1.1617 +    href="http://www.w3.org/TR/2011/REC-CSS2-20110607">http://www.w3.org/TR/2011/REC-CSS2-20110607</a>
  1.1618 +   </dd>
  1.1619 +   <!---->
  1.1620 +
  1.1621 +   <dt id=CSS3-WRITING-MODES>[CSS3-WRITING-MODES]
  1.1622 +
  1.1623 +   <dd>Elika J. Etemad; Koji Ishii. <a
  1.1624 +    href="http://www.w3.org/TR/2012/WD-css3-writing-modes-20120501/"><cite>CSS
  1.1625 +    Writing Modes Module Level 3.</cite></a> 1 May 2012. W3C Working Draft.
  1.1626 +    (Work in progress.) URL: <a
  1.1627 +    href="http://www.w3.org/TR/2012/WD-css3-writing-modes-20120501/">http://www.w3.org/TR/2012/WD-css3-writing-modes-20120501/</a>
  1.1628 +   </dd>
  1.1629 +   <!---->
  1.1630 +
  1.1631 +   <dt id=CSS3BG>[CSS3BG]
  1.1632 +
  1.1633 +   <dd>Bert Bos; Elika J. Etemad; Brad Kemper. <a
  1.1634 +    href="http://www.w3.org/TR/2012/CR-css3-background-20120724/"><cite>CSS
  1.1635 +    Backgrounds and Borders Module Level 3.</cite></a> 24 July 2012. W3C
  1.1636 +    Candidate Recommendation. (Work in progress.) URL: <a
  1.1637 +    href="http://www.w3.org/TR/2012/CR-css3-background-20120724/">http://www.w3.org/TR/2012/CR-css3-background-20120724/</a>
  1.1638 +   </dd>
  1.1639 +   <!---->
  1.1640 +
  1.1641 +   <dt id=CSS3TEXT>[CSS3TEXT]
  1.1642 +
  1.1643 +   <dd>Elika J. Etemad; Koji Ishii. <a
  1.1644 +    href="http://www.w3.org/TR/2012/WD-css3-text-20120814/"><cite>CSS Text
  1.1645 +    Level 3.</cite></a> 14 August 2012. W3C Working Draft. (Work in
  1.1646 +    progress.) URL: <a
  1.1647 +    href="http://www.w3.org/TR/2012/WD-css3-text-20120814/">http://www.w3.org/TR/2012/WD-css3-text-20120814/</a>
  1.1648 +   </dd>
  1.1649 +   <!---->
  1.1650 +
  1.1651 +   <dt id=RFC2119>[RFC2119]
  1.1652 +
  1.1653 +   <dd>S. Bradner. <a href="http://www.ietf.org/rfc/rfc2119.txt"><cite>Key
  1.1654 +    words for use in RFCs to Indicate Requirement Levels.</cite></a> Internet
  1.1655 +    RFC 2119. URL: <a
  1.1656 +    href="http://www.ietf.org/rfc/rfc2119.txt">http://www.ietf.org/rfc/rfc2119.txt</a>
  1.1657 +   </dd>
  1.1658 +   <!---->
  1.1659 +  </dl>
  1.1660 +  <!--end-normative-->
  1.1661 +
  1.1662 +  <h3 class=no-num id=informative-ref>Informative references</h3>
  1.1663 +  <!--begin-informative-->
  1.1664 +  <!-- Sorted by label -->
  1.1665 +
  1.1666 +  <dl class=bibliography>
  1.1667 +   <dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
  1.1668 +    <!---->
  1.1669 +
  1.1670 +   <dt id=CSS3COLOR>[CSS3COLOR]
  1.1671 +
  1.1672 +   <dd>Tantek Çelik; Chris Lilley; L. David Baron. <a
  1.1673 +    href="http://www.w3.org/TR/2011/REC-css3-color-20110607"><cite>CSS Color
  1.1674 +    Module Level 3.</cite></a> 7 June 2011. W3C Recommendation. URL: <a
  1.1675 +    href="http://www.w3.org/TR/2011/REC-css3-color-20110607">http://www.w3.org/TR/2011/REC-css3-color-20110607</a>
  1.1676 +   </dd>
  1.1677 +   <!---->
  1.1678 +  </dl>
  1.1679 +  <!--end-informative-->
  1.1680 +
  1.1681 +  <h2 class=no-num id=changes>Appendix C: Changes</h2>

     2.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     2.2 +++ b/css3-text-decor/Overview.src.html	Wed Sep 05 14:53:15 2012 -0700
     2.3 @@ -0,0 +1,1223 @@
     2.4 +<!DOCTYPE html>
     2.5 +<html lang="en">
     2.6 +<head>
     2.7 +  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     2.8 +  <title>CSS Text Decoration Module Level 3 (CSS3 Text Decoration)</title>
     2.9 +  <link rel=contents href="#contents">
    2.10 +  <link rel=index href="#index">
    2.11 +  <link rel="stylesheet" type="text/css" href="../default.css">
    2.12 +  <link rel="stylesheet" type="text/css"
    2.13 +        href="http://www.w3.org/StyleSheets/TR/W3C-[STATUS].css">
    2.14 +
    2.15 +</head>
    2.16 +
    2.17 +<div class="head">
    2.18 +<!--logo-->
    2.19 +
    2.20 +<h1>CSS Text Decoration Module Level 3</h1>
    2.21 +
    2.22 +<h2 class="no-num no-toc">[LONGSTATUS] [DATE]</h2>
    2.23 +<dl>
    2.24 +  <dt>This version:</dt>
    2.25 +  <!--
    2.26 +    <dd><a href="http://dev.w3.org/csswg/css3-text/">$Date$ (CVS $Revision$)</a>
    2.27 +  -->
    2.28 +    <dd><a href="http://www.w3.org/TR/[YEAR]/WD-css3-text-[CDATE]/">http://www.w3.org/TR/[YEAR]/WD-css3-text-[CDATE]/</a></dd>
    2.29 +
    2.30 +  <dt>Latest version:</dt>
    2.31 +    <dd><a href="http://www.w3.org/TR/css3-text/">http://www.w3.org/TR/css3-text/</a></dd>
    2.32 +  <dt>Latest editor's draft:</dt>
    2.33 +    <dd><a href="http://dev.w3.org/csswg/css3-text/">http://dev.w3.org/csswg/css3-text/</a></dd>
    2.34 +  <dt>Previous version:</dt>
    2.35 +    <dd><a
    2.36 +      href="http://www.w3.org/TR/2012/WD-css3-text-20120119/">http://www.w3.org/TR/2012/WD-css3-text-20120119/</a>
    2.37 +
    2.38 +  <dt>Issues List:</dt>
    2.39 +    <dd><a href="http://www.w3.org/Style/CSS/Tracker/products/10">http://www.w3.org/Style/CSS/Tracker/products/10</a>
    2.40 +
    2.41 +  <dt>Discussion:</dt>
    2.42 +    <dd><a href="http://lists.w3.org/Archives/Public/www-style/">www-style@w3.org</a> with subject line &ldquo;<kbd>[[SHORTNAME]] <var>&hellip; message topic &hellip;</var></kbd>&rdquo;
    2.43 +
    2.44 +  <dt>Editors:</dt>
    2.45 +    <dd><a href="http://fantasai.inkedblade.net/contact">Elika J. Etemad</a> (Mozilla)</dd>
    2.46 +    <dd><a href="mailto:koji.a.ishii@mail.rakuten.com">Koji Ishii</a> (Rakuten, Inc.)</dd>
    2.47 +</dl>
    2.48 +
    2.49 +<!--copyright-->
    2.50 +
    2.51 +<hr title="Separator for header">
    2.52 +</div>
    2.53 +
    2.54 +<h2 class="no-num no-toc" id="abstract">Abstract</h2>
    2.55 +
    2.56 +  <p>This module contains the features of CSS relating to
    2.57 +  text decoration, such as underlines, text shadows, and emphasis marks.
    2.58 +  <a href="http://www.w3.org/TR/CSS/">CSS</a> is a language for describing
    2.59 +  the rendering of structured documents (such as HTML and XML) on screen, on
    2.60 +  paper, in speech, etc.
    2.61 +
    2.62 +<h2 class="no-num no-toc" id="status">Status of this document</h2>
    2.63 +
    2.64 +
    2.65 +  <p><em>This section describes the status of this document at the time of
    2.66 +   its publication. Other documents may supersede this document. A list of
    2.67 +   current W3C publications and the latest revision of this technical report
    2.68 +   can be found in the <a href="http://www.w3.org/TR/">W3C technical reports
    2.69 +   index at http://www.w3.org/TR/.</a></em>
    2.70 +
    2.71 +  <p>Publication as a Working Draft does not imply endorsement by the W3C
    2.72 +   Membership. This is a draft document and may be updated, replaced or
    2.73 +   obsoleted by other documents at any time. It is inappropriate to cite this
    2.74 +   document as other than work in progress.
    2.75 +
    2.76 +  <p>This CSS module has been produced as a combined effort of the <a
    2.77 +    href="http://www.w3.org/International/Activity">W3C Internationalization Activity</a>,
    2.78 +    and the <a href="http://www.w3.org/Style/Activity">Style Activity</a> and is maintained
    2.79 +    by the <a href="http://www.w3.org/Style/CSS/members">CSS Working Group</a>. It also
    2.80 +    includes contributions made by participants in the <a
    2.81 +    href="http://www.w3.org/Style/XSL/Group/">XSL Working Group</a> (<a
    2.82 +    href="http://cgi.w3.org/MemberAccess/AccessRequest">members
    2.83 +    only</a>).
    2.84 +
    2.85 +  <p>This document was produced by a group operating under the <a
    2.86 +   href="http://www.w3.org/Consortium/Patent-Policy-20040205/">5 February
    2.87 +   2004 W3C Patent Policy</a>. W3C maintains a <a
    2.88 +   href="http://www.w3.org/2004/01/pp-impl/32061/status"
    2.89 +   rel=disclosure>public list of any patent disclosures</a> made in
    2.90 +   connection with the deliverables of the group; that page also includes
    2.91 +   instructions for disclosing a patent. An individual who has actual
    2.92 +   knowledge of a patent which the individual believes contains <a
    2.93 +   href="http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential">Essential
    2.94 +   Claim(s)</a> must disclose the information in accordance with <a
    2.95 +   href="http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure">section
    2.96 +   6 of the W3C Patent Policy</a>.</p>
    2.97 +
    2.98 +  <p><strong>Feedback on this draft should be posted to the
    2.99 +    (<a href="http://lists.w3.org/Archives/Public/www-style/">archived</a>)
   2.100 +    public mailing list <a href="mailto:www-style@w3.org">www-style@w3.org</a></strong>
   2.101 +    (see <a href="http://www.w3.org/Mail/Request">instructions</a>) <strong>with
   2.102 +    <kbd>[css3-text]</kbd> in the subject line.</strong>
   2.103 +    You are strongly encouraged to complain if you see something stupid
   2.104 +    in this draft. The editors will do their best to respond to all feedback.</p>
   2.105 +
   2.106 +  <p>The following features are at risk and may be cut from the spec during
   2.107 +    its CR period if there are no (correct) implementations:</p>
   2.108 +    
   2.109 +  <p>The following features are at risk and may be cut from the spec during
   2.110 +    its CR period if there are no (correct) implementations:</p>
   2.111 +    <ul>
   2.112 +      <li>the 'text-decoration-skip' property / ''ink'' value
   2.113 +    </ul>
   2.114 +
   2.115 +<h2 id="intro">
   2.116 +Introduction</h2>
   2.117 +
   2.118 +  <p>[document here]</p>
   2.119 +
   2.120 +  <p class="issue">This draft describes features that are specific to certain scripts.
   2.121 +  There is an ongoing discussion about where these features belong: in
   2.122 +  existing CSS properties, in new CSS properties, or perhaps in other
   2.123 +  specifications.
   2.124 +
   2.125 +
   2.126 +<h3 id="placement">
   2.127 +Module Interactions</h3>
   2.128 +
   2.129 +  <p>This module replaces and extends the text-level
   2.130 +  features defined in [[!CSS21]] chapter 16.
   2.131 +
   2.132 +<h3 id="values">
   2.133 +Values</h3>
   2.134 +
   2.135 +  <p>This specification follows the
   2.136 +  <a href="http://www.w3.org/TR/CSS21/about.html#property-defs">CSS property
   2.137 +  definition conventions</a> from [[!CSS21]]. Value types not defined in
   2.138 +  this specification are defined in CSS Level 2 Revision 1 [[!CSS21]].
   2.139 +  Other CSS modules may expand the definitions of these value types: for
   2.140 +  example [[CSS3COLOR]], when combined with this module, expands the
   2.141 +  definition of the &lt;color&gt; value type as used in this specification.</p>
   2.142 +
   2.143 +  <p>In addition to the property-specific values listed in their definitions,
   2.144 +  all properties defined in this specification also accept the
   2.145 +  <a href="http://www.w3.org/TR/CSS21/cascade.html#value-def-inherit">inherit</a>
   2.146 +  keyword as their property value. For readability it has not been repeated
   2.147 +  explicitly.
   2.148 +
   2.149 +  <p>The <dfn>''currentcolor''</dfn> keyword here computes to itself and is
   2.150 +  resolved to the value of 'color' after inheritance is performed. This is
   2.151 +  so that the 'text-emphasis-color' by default matches the text 'color'.
   2.152 +  <span class="issue">CSS3 Color has not yet been errata'd to define it this way;
   2.153 +  currentcolor there is defined to compute to the value of 'color',
   2.154 +  which gives it the wrong inheritance behavior.</span>
   2.155 +
   2.156 +<h3 id="terms">Terminology</h3>
   2.157 +
   2.158 +  <p>The terms <a href="http://www.w3.org/TR/css3-text/#grapheme-cluster"><dfn>character</dfn></a>,
   2.159 +    <a href="http://www.w3.org/TR/css3-text/#letter"><dfn>letter</dfn></a>, and
   2.160 +    <a href="http://www.w3.org/TR/css3-text/#content-language"><dfn>content language</dfn></a>
   2.161 +    as used in this specification are defined in [[!CSS3TEXT]].
   2.162 +    Other terminology and concepts used in this specification are defined
   2.163 +    in [[!CSS21]] and [[!CSS3-WRITING-MODES]].
   2.164 +
   2.165 +<h2 id="line-decoration">
   2.166 +Line Decoration: Underline, Overline, and Strike-Through</h2>
   2.167 +
   2.168 +  <p>The following properties describe line decorations that are added
   2.169 +    to the content of an element. When specified on or propagated to
   2.170 +    an inline box, such decoration affects all the boxes generated
   2.171 +    by that element, and is further propagated to any in-flow block-level
   2.172 +    boxes that split the inline
   2.173 +    (see <a href="http://www.w3.org/TR/CSS21/visuren.html#anonymous-block-level">CSS2.1 section 9.2.1.1</a>)
   2.174 +    When specified on or propagated to a ruby box, the decorations are
   2.175 +    further propagated only to the ruby base.
   2.176 +    When specified on or propagated to a a block container that establishes
   2.177 +    an inline formatting context, the decorations are propagated to an
   2.178 +    anonymous inline element that wraps all the in-flow inline-level children
   2.179 +    of the block container. For all other elements, the decorations are
   2.180 +    propagated to any in-flow children.
   2.181 +
   2.182 +  <p class="note">Note that text decorations are not propagated to any
   2.183 +    out-of-flow descendants, nor to the contents of atomic inline-level
   2.184 +    descendants such as inline blocks and inline tables.
   2.185 +
   2.186 +  <p>By default underlines, overlines, and line-throughs are applied only
   2.187 +    to text (including white space, letter spacing, and word spacing):
   2.188 +    margins, borders, and padding are skipped. Elements containing
   2.189 +    no text, such as images, are likewise not decorated.
   2.190 +    The 'text-decoration-skip'
   2.191 +    property can be used to modify this behavior, for example allowing
   2.192 +    inline replaced elements to be underlined or requiring that white
   2.193 +    space be skipped.
   2.194 +
   2.195 +  <p>In determining the position and thickness of text decoration lines,
   2.196 +    user agents may consider the font sizes and dominant baselines of
   2.197 +    descendants, but for a given element's decoration must use the same
   2.198 +    position and thickness throughout each line box. The
   2.199 +    <a href="#text-decoration-color">color</a> and
   2.200 +    <a href="#text-decoration-style">line style</a> of decorations must
   2.201 +    remain the same on all decorations applied by a given element, even
   2.202 +    if descendant elements have different color or line style values.</p>
   2.203 +
   2.204 +  <div class="example">
   2.205 +    <p>The following figure shows the averaging for underline:
   2.206 +    <p><img alt="In the first rendering of the underlined text '1st a'
   2.207 +                 with 'st' as a superscript, both the '1st' and the 'a'
   2.208 +                 are rendered in a small font. In the second rendering,
   2.209 +                 the 'a' is rendered in a larger font. In the third, both
   2.210 +                 '1st' and 'a' are large."
   2.211 +            height="105" src="underline-averaging.gif" width="326">
   2.212 +    <p>In the three fragments of underlined text, the underline is drawn
   2.213 +      consecutively lower and thicker as the ratio of large text to small
   2.214 +      text increases.</p>
   2.215 +  </div>
   2.216 +
   2.217 +  <p>Relatively positioning a descendant moves all text decorations
   2.218 +    affecting it along with the descendant's text; it does not affect
   2.219 +    calculation of the decoration's initial position on that line.
   2.220 +    The 'visibility' property, filters, and other graphical transformations
   2.221 +    likewise affect text decorations as part of the text they're drawn on,
   2.222 +    even if the decorations were specified on an ancestor element.
   2.223 +    <span class="issue">Does this include 'text-shadow'? What about text-fill etc.?</span>
   2.224 +
   2.225 +  <div class="example">
   2.226 +    <p>In the following style sheet and document fragment:</p>
   2.227 +    <pre><code class="css">
   2.228 +<!-- -->   blockquote { text-decoration: underline; color: blue; }
   2.229 +<!-- -->   em { display: block; }
   2.230 +<!-- -->   cite { color: fuchsia; }
   2.231 +<!----></code></pre>
   2.232 +    <pre class="html"><code>
   2.233 +<!-- -->   &lt;blockquote&gt;
   2.234 +<!-- -->    &lt;p&gt;
   2.235 +<!-- -->     &lt;span&gt;
   2.236 +<!-- -->      Help, help!
   2.237 +<!-- -->      &lt;em&gt; I am under a hat! &lt;/em&gt;
   2.238 +<!-- -->
   2.239 +<!-- -->      &lt;cite&gt; &mdash;GwieF &lt;/cite&gt;
   2.240 +<!-- -->     &lt;/span&gt;
   2.241 +<!-- -->    &lt;/p&gt;
   2.242 +<!-- -->   &lt;/blockquote&gt;
   2.243 +<!----></code></pre>
   2.244 +    <p>...the underlining for the blockquote element is propagated to an
   2.245 +    anonymous inline element that surrounds the span element, causing
   2.246 +    the text "Help, help!" to be blue, with the blue underlining from
   2.247 +    the anonymous inline underneath it, the color being taken from the
   2.248 +    blockquote element. The <code>&lt;em&gt;text&lt;/em&gt;</code>
   2.249 +    in the em block is also underlined, as it is in an in-flow block to
   2.250 +    which the underline is propagated. The final line of text is fuchsia,
   2.251 +    but the underline underneath it is still the blue underline from the
   2.252 +    anonymous inline element.</p>
   2.253 +    <p><img src="underline-example.png" alt="Sample rendering of the above underline example"></p>
   2.254 +    <p>This diagram shows the boxes involved in the example above. The
   2.255 +    rounded aqua line represents the anonymous inline element wrapping
   2.256 +    the inline contents of the paragraph element, the rounded blue line
   2.257 +    represents the span element, and the orange lines represent the
   2.258 +    blocks.</p>
   2.259 +  </div>
   2.260 +
   2.261 +<h3 id="text-decoration-line-property">
   2.262 +Text Decoration Lines: the 'text-decoration-line' property</h3>
   2.263 +
   2.264 +  <table class="propdef">
   2.265 +    <tr>
   2.266 +      <th>Name:
   2.267 +      <td><dfn>text-decoration-line</dfn>
   2.268 +    <tr>
   2.269 +      <th><a href="#values">Value</a>:
   2.270 +      <td>none | [ underline || overline || line-through ]
   2.271 +
   2.272 +    <tr>
   2.273 +      <th>Initial:
   2.274 +      <td>none
   2.275 +    <tr>
   2.276 +      <th>Applies to:
   2.277 +      <td>all elements
   2.278 +    <tr>
   2.279 +      <th>Inherited:
   2.280 +      <td>no (but see prose)
   2.281 +    <tr>
   2.282 +      <th>Percentages:
   2.283 +      <td>N/A
   2.284 +    <tr>
   2.285 +      <th>Media:
   2.286 +      <td>visual
   2.287 +    <tr>
   2.288 +      <th>Computed&#160;value:
   2.289 +      <td>as specified
   2.290 +  </table>
   2.291 +
   2.292 +  <p>Specifies what line decorations, if any, are added to the element.
   2.293 +    Values have the following meanings:</p>
   2.294 +
   2.295 +  <dl>
   2.296 +    <dt><dfn title="text-decoration-line:none">''none''</dfn>
   2.297 +      <dd>Neither produces nor inhibits text decoration.
   2.298 +    <dt><dfn>''underline''</dfn>
   2.299 +      <dd>Each line of text is underlined.
   2.300 +    <dt><dfn>''overline''</dfn>
   2.301 +      <dd>Each line of text has a line above it (i.e. on the opposite
   2.302 +      side from an underline).
   2.303 +    <dt><dfn>''line-through''</dfn>
   2.304 +      <dd>Each line of text has a line through the middle.
   2.305 +  </dl>
   2.306 +
   2.307 +<h3 id="text-decoration-color-property">
   2.308 +Text Decoration Color: the 'text-decoration-color' property</h3>
   2.309 +
   2.310 +  <table class="propdef">
   2.311 +    <tr>
   2.312 +      <th>Name:
   2.313 +      <td><dfn>text-decoration-color</dfn>
   2.314 +    <tr>
   2.315 +      <th><a href="#values">Value</a>:
   2.316 +      <td><a href="http://www.w3.org/TR/css3-color/#color0"><span class="value-inst-color">&lt;color&gt;</span></a>
   2.317 +
   2.318 +    <tr>
   2.319 +      <th>Initial:
   2.320 +      <td><a href="http://www.w3.org/TR/css3-color/#currentcolor">currentColor</a>
   2.321 +    <tr>
   2.322 +      <th>Applies to:
   2.323 +      <td>all elements
   2.324 +    <tr>
   2.325 +      <th>Inherited:
   2.326 +      <td>no
   2.327 +    <tr>
   2.328 +      <th>Percentages:
   2.329 +      <td>N/A
   2.330 +    <tr>
   2.331 +      <th>Media:
   2.332 +      <td>visual
   2.333 +    <tr>
   2.334 +      <th>Computed&#160;value:
   2.335 +      <td>the computed color
   2.336 +  </table>
   2.337 +
   2.338 +  <p>This property specifies the color of text decoration (underlines
   2.339 +    overlines, and line-throughs) set on the element with
   2.340 +    'text-decoration-line'.</p>
   2.341 +
   2.342 +<h3 id="text-decoration-style-property">
   2.343 +Text Decoration Style: the 'text-decoration-style' property</h3>
   2.344 +
   2.345 +  <table class="propdef">
   2.346 +    <tr>
   2.347 +      <th>Name:
   2.348 +      <td><dfn>text-decoration-style</dfn>
   2.349 +    <tr>
   2.350 +      <th><a href="#values">Value</a>:
   2.351 +      <td>solid | double | dotted | dashed | wavy
   2.352 +
   2.353 +    <tr>
   2.354 +      <th>Initial:
   2.355 +      <td>solid
   2.356 +    <tr>
   2.357 +      <th>Applies to:
   2.358 +      <td>all elements
   2.359 +    <tr>
   2.360 +      <th>Inherited:
   2.361 +      <td>no
   2.362 +    <tr>
   2.363 +      <th>Percentages:
   2.364 +      <td>N/A
   2.365 +    <tr>
   2.366 +      <th>Media:
   2.367 +      <td>visual
   2.368 +    <tr>
   2.369 +      <th>Computed&#160;value:
   2.370 +      <td>as specified
   2.371 +  </table>
   2.372 +
   2.373 +  <p>This property specifies the style of the line(s) drawn for
   2.374 +    text decoration specified on the element. Values have the
   2.375 +    same meaning as for the
   2.376 +    <a href="http://www.w3.org/TR/css3-background/#the-border-style">border-style
   2.377 +    properties</a> [[!CSS3BG]]. ''wavy'' indicates a wavy line.</p>
   2.378 +
   2.379 +<h3 id="text-decoration-property">
   2.380 +Text Decoration Shorthand: the 'text-decoration' property</h3>
   2.381 +
   2.382 +  <table class="propdef">
   2.383 +    <tr>
   2.384 +      <th>Name:
   2.385 +      <td><dfn>text-decoration</dfn>
   2.386 +    <tr>
   2.387 +      <th><a href="#values">Value</a>:
   2.388 +      <td><var><a href="#text-decoration-line">&lt;text-decoration-line&gt;</a></var> ||
   2.389 +          <var><a href="#text-decoration-style">&lt;text-decoration-style&gt;</a></var> ||
   2.390 +          <var><a href="#text-decoration-color">&lt;text-decoration-color&gt;</a></var> || blink
   2.391 +
   2.392 +    <tr>
   2.393 +      <th>Initial:
   2.394 +      <td>none
   2.395 +    <tr>
   2.396 +      <th>Applies to:
   2.397 +      <td>all elements
   2.398 +    <tr>
   2.399 +      <th>Inherited:
   2.400 +      <td>no
   2.401 +    <tr>
   2.402 +      <th>Percentages:
   2.403 +      <td>N/A
   2.404 +    <tr>
   2.405 +      <th>Media:
   2.406 +      <td>visual
   2.407 +    <tr>
   2.408 +      <th>Computed&#160;value:
   2.409 +      <td>as specified
   2.410 +  </table>
   2.411 +
   2.412 +  <p>This property is a shorthand for setting 'text-decoration-line',
   2.413 +    'text-decoration-color', and 'text-decoration-style' in one declaration.
   2.414 +    Omitted values are set to their initial values. A 'text-decoration'
   2.415 +    declaration that omits both the 'text-decoration-color'
   2.416 +    and 'text-decoration-style' values is backwards-compatible
   2.417 +    with CSS Levels 1 and 2.</p>
   2.418 +
   2.419 +  <p>If the ''blink'' keyword is specified the text blinks
   2.420 +    (alternates between visible and invisible). Conforming user agents
   2.421 +    may simply not blink the text. Note that not blinking the text is
   2.422 +    one technique to satisfy
   2.423 +    <a href="http://www.w3.org/TR/UAAG/guidelines.html#tech-on-off-blinking-text">checkpoint 3.3 of WAI-UAAG</a>.</p>
   2.424 +
   2.425 +  <div class="example">
   2.426 +    <p>The following example underlines unvisited links with a solid blue
   2.427 +    underline in CSS1 and CSS2 UAs and a navy dotted underline in CSS3 UAs.</p>
   2.428 +
   2.429 +    <pre><code class="css">
   2.430 +<!-- -->:link {
   2.431 +<!-- -->    color: blue;
   2.432 +<!-- -->    text-decoration: underline;
   2.433 +<!-- -->    text-decoration: navy dotted underline; /* <a href="http://www.w3.org/TR/CSS21/syndata.html#ignore">Ignored</a> in CSS1/CSS2 UAs */
   2.434 +<!-- -->}</code></pre>
   2.435 +  </div>
   2.436 +
   2.437 +<h3 id="text-decoration-skip-property">
   2.438 +Text Decoration Line Continuity: the 'text-decoration-skip' property</h3>
   2.439 +
   2.440 +  <table class="propdef">
   2.441 +    <tr>
   2.442 +      <th>Name:
   2.443 +      <td><dfn>text-decoration-skip</dfn>
   2.444 +    <tr>
   2.445 +      <th><a href="#values">Value</a>:
   2.446 +      <td>none | [ objects || spaces || ink || edges ]
   2.447 +
   2.448 +    <tr>
   2.449 +      <th>Initial:
   2.450 +      <td>objects
   2.451 +    <tr>
   2.452 +      <th>Applies to:
   2.453 +      <td>all elements
   2.454 +    <tr>
   2.455 +      <th>Inherited:
   2.456 +      <td>yes
   2.457 +    <tr>
   2.458 +      <th>Percentages:
   2.459 +      <td>N/A
   2.460 +    <tr>
   2.461 +      <th>Media:
   2.462 +      <td>visual
   2.463 +    <tr>
   2.464 +      <th>Computed&#160;value:
   2.465 +      <td>as specified
   2.466 +  </table>
   2.467 +
   2.468 +  <p>This property specifies what parts of the element's content
   2.469 +    any text decoration affecting the element must skip over. It
   2.470 +    controls all text decoration lines drawn by the element
   2.471 +    and also any text decoration lines drawn by its ancestors.
   2.472 +    Values have the following meanings:</p>
   2.473 +
   2.474 +  <dl>
   2.475 +    <dt><dfn title="text-decoration-skip:none">''none''</dfn></dt>
   2.476 +    <dd>Skip nothing: text-decoration is drawn for all text content
   2.477 +      and for inline replaced elements.</dd>
   2.478 +    <dt><dfn title="text-decoration-skip:objects">''objects''</dfn></dt>
   2.479 +    <dd>Skip this element if it is an atomic inline (such as an
   2.480 +      image or inline-block).</dd>
   2.481 +    <dt><dfn title="text-decoration-skip:spaces">''spaces''</dfn></dt>
   2.482 +    <dd>Skip white space: this includes regular spaces (U+0020) and
   2.483 +      tabs (U+0009), as well as nbsp (U+00A0), ideographic space
   2.484 +      (U+3000), all fixed width spaces (such as U+2000&ndash;U+200A,
   2.485 +      U+202F and U+205F), and any adjacent letter-spacing or
   2.486 +      word-spacing.</dd>
   2.487 +    <dt><dfn title="text-decoration-skip:ink">''ink''</dfn></dt>
   2.488 +    <dd>Skip over where glyphs are drawn: interrupt the decoration
   2.489 +      line to let text show through where the text decoration would
   2.490 +      otherwise cross over a glyph. The UA may also skip a small
   2.491 +      distance to either side of the glyph outline.</dd>
   2.492 +    <dt><dfn title="text-decoration-skip:edges">''edges''</dfn></dt>
   2.493 +    <dd>The UA should place the start and end of the line inwards from
   2.494 +      the content edge of the decorating element so that, e.g. two
   2.495 +      underlined elements side-by-side do not appear to have a single
   2.496 +      underline. (This is important in Chinese, where underlining is a
   2.497 +      form of punctuation.)</dd>
   2.498 +  </dl>
   2.499 +
   2.500 +  <p class="issue">Do we need a value that <em>doesn't</em> skip
   2.501 +    margins and padding?</p>
   2.502 +
   2.503 +  <p class="note">Note that this property inherits and that descendant
   2.504 +    elements can have a different setting.</p>
   2.505 +
   2.506 +<h4 id="text-underline-position-property">
   2.507 +Text Underline Position: the 'text-underline-position' property</h4>
   2.508 +
   2.509 +  <table class="propdef">
   2.510 +    <tr>
   2.511 +      <th>Name:
   2.512 +      <td><dfn>text-underline-position</dfn>
   2.513 +    <tr>
   2.514 +      <th><a href="#values">Value</a>:
   2.515 +      <td>auto | alphabetic | [ below || [ left | right ] ]
   2.516 +
   2.517 +    <tr>
   2.518 +      <th>Initial:
   2.519 +      <td>auto
   2.520 +    <tr>
   2.521 +      <th>Applies to:
   2.522 +      <td>all elements
   2.523 +    <tr>
   2.524 +      <th>Inherited:
   2.525 +      <td>yes
   2.526 +    <tr>
   2.527 +      <th>Percentages:
   2.528 +      <td>N/A
   2.529 +    <tr>
   2.530 +      <th>Media:
   2.531 +      <td>visual
   2.532 +    <tr>
   2.533 +      <th>Computed&#160;value:
   2.534 +      <td>as specified
   2.535 +  </table>
   2.536 +
   2.537 +  <p>This property sets the position of an underline specified
   2.538 +    on the same element: it does not affect underlines specified by
   2.539 +    ancestor elements. Values have the following meanings:</p>
   2.540 +
   2.541 +  <dl>
   2.542 +    <dt><dfn>''auto''</dfn></dt>
   2.543 +    <dd>The user agent may use any algorithm to determine the
   2.544 +      underline's position; however it must be placed at or below
   2.545 +      the alphabetic baseline.
   2.546 +      <p class="note">It is suggested that the underline position
   2.547 +      be ''alphabetic'' unless it crosses either subscripted (or
   2.548 +      otherwise lowered) text, or it affects characters from Asian
   2.549 +      scripts such as Han or Tibetan, for which an alphabetic
   2.550 +      underline is too high: in such cases, aligning to the em box
   2.551 +      edge as described for ''below left'' is more appropriate.
   2.552 +    <dt><dfn>''alphabetic''</dfn></dt>
   2.553 +    <dd>The underline is positioned relative to the alphabetic baseline. In
   2.554 +      this case the underline is likely to cross some descenders.
   2.555 +      <div class="figure">
   2.556 +        <p><img title="text-underline-position: alphabetic"
   2.557 +            alt="In a typical Latin font, the underline is positioned slightly
   2.558 +                 below the alphabetic baseline, leaving a gap between the line
   2.559 +                 and the bottom of most Latin letters, but crossing through
   2.560 +                 descenders such as the stem of a 'p'."
   2.561 +            src="underline-position-alphabetic.png"
   2.562 +            >
   2.563 +        <p class="caption">''text-underline-position: alphabetic''</p>
   2.564 +      </div>
   2.565 +    <dt><dfn>''below''</dfn></dt>
   2.566 +    <dd>In horizontal writing modes, the underline is positioned
   2.567 +      relative to the under edge of the element's content box.
   2.568 +      In this case the underline usually does not cross the descenders.
   2.569 +      (This is sometimes called "accounting" underline.)
   2.570 +      If the underline affects descendants with a lower content edge,
   2.571 +      the user agent should shift the underline down further to the
   2.572 +      lowest underlined content box edge.
   2.573 +      The user agent may ignore elements with ''vertical-align''
   2.574 +      values given as lengths, percentages, ''top'', or ''bottom''
   2.575 +      when making this adjustment.
   2.576 +      (Note that images that are not affected by the underline per
   2.577 +      'text-decoration-skip' will not affect the position of the
   2.578 +      underline.)
   2.579 +      <div class="figure">
   2.580 +        <p><img title="text-underline-position: below"
   2.581 +            alt="In a typical Latin font, the underline is far enough
   2.582 +                 below the text that it does not cross the bottom of a 'g'."
   2.583 +            src="underline-position-below.png"
   2.584 +            >
   2.585 +        <p class="caption">''text-underline-position: below''</p>
   2.586 +      </div>
   2.587 +      <div class="example">
   2.588 +        <p>Because 'text-underline-position' inherits, and is not reset
   2.589 +          by the 'text-decoration' shorthand, the following example
   2.590 +          switches the document to use ''below'' underlining, which can
   2.591 +          be more appropriate for writing systems  with long, complicated
   2.592 +          descenders. It is also often useful for mathematical or chemical
   2.593 +          texts that use many subscripts.
   2.594 +        <pre>:root { text-underline-position: below; }</pre>
   2.595 +      </div>
   2.596 +    <dt><dfn>''left''</dfn></dt>
   2.597 +    <dd>In vertical writing modes, the underline is aligned as for
   2.598 +      ''below'', on the left edge of the text.</dd>
   2.599 +    <dt><dfn>''right''</dfn></dt>
   2.600 +    <dd>In vertical writing modes, the underline is aligned as for
   2.601 +      ''below'', except it is aligned to the right edge of the text.
   2.602 +      If this causes the underline to be drawn on the "over" side of
   2.603 +      the text, then an overline also switches sides and is drawn on
   2.604 +      the "under" side.</dd>
   2.605 +  </dl>
   2.606 +
   2.607 +  <p>If ''below'' is specified alone, ''left'' is also implied.
   2.608 +    If ''left'' or ''right'' is specified alone, ''below'' is also
   2.609 +    implied.
   2.610 +
   2.611 +  <p class="issue">
   2.612 +  Should ''above''/''below'' be ''over''/''under'' to match text decoration names?
   2.613 +
   2.614 +  <div class="figure" id="fig-text-underline-position">
   2.615 +    <table>
   2.616 +      <tr>
   2.617 +        <td>
   2.618 +          <img alt="In mixed Japanese-Latin vertical text, 'text-underline-position: left'
   2.619 +                    places the underline on the left side of the text."
   2.620 +            title="text-underline-position: left"
   2.621 +            src="underline-position-left.png"
   2.622 +            >
   2.623 +
   2.624 +        <td>
   2.625 +          <img alt="In mixed Japanese-Latin vertical text, 'text-underline-position: right'
   2.626 +                    places the underline on the right side of the text."
   2.627 +            title="text-underline-position: right"
   2.628 +            src="underline-position-right.png"
   2.629 +            >
   2.630 +
   2.631 +      <tr>
   2.632 +        <td>''left''
   2.633 +        <td>''right''
   2.634 +    </table>
   2.635 +    <p class="caption">In vertical writing modes, the 'text-underline-position'
   2.636 +      values ''left'' and ''right'' allow placing the underline on either
   2.637 +      side of the text. (In horizontal writing modes, both values are
   2.638 +      treated as ''below''.)</p>
   2.639 +  </div>
   2.640 +
   2.641 +  <div class="example">
   2.642 +    <p>The following example styles modern Chinese, Japanese, and Korean
   2.643 +      texts with the appropriate underline positions in both horizontal
   2.644 +      and vertical text:
   2.645 +    <pre>:root:lang(ja), [lang|=ja], :root:lang(ko), [lang|=ko] { text-underline-position: below right; }
   2.646 +<!--   -->:root:lang(zh), [lang|=zh] { text-underline-position: below left; }</pre>
   2.647 +  </div>
   2.648 +
   2.649 +  <div class="note">
   2.650 +    <p>In some cases (such as in OpenType) the font format can offer
   2.651 +      information about the appropriate position of an underline.
   2.652 +      Typically this information gives the position of an ''alphabetic''
   2.653 +      underline; in some cases (especially in CJK fonts), it gives
   2.654 +      the position of a ''below left'' underline. (In this case,
   2.655 +      the font's underline metrics typically touch the bottom edge
   2.656 +      of the em box).
   2.657 +      The UA is encouraged to use information (such as the underline
   2.658 +      thickness, or appropriate alphabetic alignment) from the font
   2.659 +      wherever appropriate.
   2.660 +    </p>
   2.661 +  </div>
   2.662 +
   2.663 +<h3 id="emphasis-marks">
   2.664 +Emphasis Marks</h3>
   2.665 +
   2.666 +  <p>East Asian documents traditionally use small symbols next to each glyph to emphasize
   2.667 +    a run of text. For example:</p>
   2.668 +
   2.669 +  <div class="figure">
   2.670 +    <p>
   2.671 +      <img alt="Example of emphasis in Japanese appearing above the text"
   2.672 +           class="example" src="text-emphasis-ja.gif" height="28" width="225"></p>
   2.673 +    <p class="caption">Accent emphasis (shown in blue for clarity) applied to Japanese text</p>
   2.674 +  </div>
   2.675 +
   2.676 +<h4 id="text-emphasis-style-property">
   2.677 +Emphasis Mark Style: the 'text-emphasis-style' property</h4>
   2.678 +
   2.679 +  <table class="propdef">
   2.680 +    <tr>
   2.681 +      <th>Name:
   2.682 +      <td><dfn>text-emphasis-style</dfn>
   2.683 +    <tr>
   2.684 +      <th><a href="#values">Value</a>:
   2.685 +      <td>none |
   2.686 +          [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] |
   2.687 +          <a class="noxref" href="http://www.w3.org/TR/CSS21/syndata.html#value-def-string"><span class="value-inst-string">&lt;string&gt;</span></a>
   2.688 +
   2.689 +    <tr>
   2.690 +      <th>Initial:
   2.691 +      <td>none
   2.692 +    <tr>
   2.693 +      <th>Applies to:
   2.694 +      <td>all elements
   2.695 +    <tr>
   2.696 +      <th>Inherited:
   2.697 +      <td>yes
   2.698 +    <tr>
   2.699 +      <th>Percentages:
   2.700 +      <td>N/A
   2.701 +    <tr>
   2.702 +      <th>Media:
   2.703 +      <td>visual
   2.704 +    <tr>
   2.705 +      <th>Computed&#160;value:
   2.706 +      <td>'none', a pair of keywords representing the shape and fill, or
   2.707 +        a string
   2.708 +  </table>
   2.709 +
   2.710 +  <p>This property applies emphasis marks to the element's text.
   2.711 +    Values have the following meanings:</p>
   2.712 +
   2.713 +  <dl>
   2.714 +    <dt><dfn title="text-emphasis:none">''none''</dfn></dt>
   2.715 +      <dd>No emphasis marks.</dd>
   2.716 +    <dt><dfn title="text-emphasis:filled">''filled''</dfn></dt>
   2.717 +      <dd>The shape is filled with solid color.</dd>
   2.718 +    <dt><dfn title="text-emphasis:open">''open''</dfn></dt>
   2.719 +      <dd>The shape is hollow.</dd>
   2.720 +    <dt><dfn title="text-emphasis:dot">''dot''</dfn></dt>
   2.721 +      <dd>Display small circles as marks.
   2.722 +        The filled dot is U+2022 '&#x2022;', and the open dot is U+25E6 '&#x25e6;'.</dd>
   2.723 +    <dt><dfn title="text-emphasis:circle">''circle''</dfn></dt>
   2.724 +      <dd>Display large circles as marks.
   2.725 +        The filled circle is U+25CF '&#x25cf;', and the open circle is U+25CB '&#x25cb;'.</dd>
   2.726 +    <dt><dfn title="text-emphasis:double-circle">''double-circle''</dfn></dt>
   2.727 +      <dd>Display double circles as marks.
   2.728 +        The filled double-circle is U+25C9 '&#x25c9;', and the open double-circle is U+25CE '&#x25ce;'.</dd>
   2.729 +    <dt><dfn title="text-emphasis:triangle">''triangle''</dfn></dt>
   2.730 +      <dd>Display triangles as marks.
   2.731 +        The filled triangle is U+25B2 '&#x25b2;', and the open triangle is U+25B3 '&#x25b3;'.</dd>
   2.732 +    <dt><dfn title="text-emphasis:sesame">''sesame''</dfn></dt>
   2.733 +      <dd>Display sesames as marks.
   2.734 +        The filled sesame is U+FE45 '&#xfe45;', and the open sesame is U+FE46 '&#xfe46;'.</dd>
   2.735 +    <dt><dfn title="text-emphasis:sesame">''<var>&lt;string&gt;</var>''</dfn></dt>
   2.736 +      <dd>Display the given string as marks.
   2.737 +        Authors should not specify more than one <i>character</i> in &lt;string&gt;.
   2.738 +        The UA may truncate or ignore strings consisting of more than one grapheme cluster.</dd>
   2.739 +  </dl>
   2.740 +
   2.741 +  <p>If a shape keyword is specified but neither of ''filled'' nor ''open'' is
   2.742 +    specified, ''filled'' is assumed. If only ''filled'' or ''open'' is specified,
   2.743 +    the shape keyword computes to ''circle'' in horizontal writing mode and
   2.744 +    ''sesame'' in vertical writing mode.</p>
   2.745 +
   2.746 +  <p>The marks should be drawn using the element's font settings with its
   2.747 +    size scaled down to 50%. However, not all fonts have all these glyphs,
   2.748 +    and some fonts use inappropriate sizes for emphasis marks in these
   2.749 +    code points. The UA may opt to use a font known to be good for
   2.750 +    emphasis marks, or the marks may instead be synthesized by the UA.
   2.751 +    Marks must remain upright in vertical writing modes: like CJK
   2.752 +    characters, they do not rotate to match the writing mode.</p>
   2.753 +
   2.754 +  <p class="note">
   2.755 +      One example of good fonts for emphasis marks is Adobe's opensource project,
   2.756 +      <a href="http://sourceforge.net/adobe/kenten-generic/">Kenten Generic OpenType Font</a>,
   2.757 +      which is specially designed for the emphasis marks.
   2.758 +  </p>
   2.759 +
   2.760 +  <p>The marks are drawn once for each <i>character</i>. However,
   2.761 +    emphasis marks are not drawn for characters that are:</p>
   2.762 +  <ul>
   2.763 +    <li><a href="http://www.w3.org/TR/css3-text/#word-separator">Word separators</a> or that
   2.764 +      belong to the Unicode separator classes (Z*).
   2.765 +      (But note that emphasis marks <em>are</em> drawn for a space
   2.766 +       that combines with any combining characters.)</li>
   2.767 +    <li>Characters belonging to the Unicode classes for control codes
   2.768 +      and unassigned characters (Cc, Cf, Cn).</li>
   2.769 +  </ul>
   2.770 +
   2.771 +  <p>If emphasis marks are drawn for characters
   2.772 +    for which ruby is drawn in the same position as the emphasis mark,
   2.773 +    the ruby should be stacked between the emphasis marks and the base text.
   2.774 +    In this case, the position of the emphasis marks for a given element
   2.775 +    should be determined as if all characters have ruby boxes
   2.776 +    of the same height as the highest ruby box in the element.
   2.777 +    If the UA is not capable of drawing ruby and emphasis marks on the same side,
   2.778 +    the UA may hide ruby and draw only emphasis marks.</p>
   2.779 +  <div class="figure">
   2.780 +    <p><img
   2.781 +      alt="Example of emphasis marks applied to 4 characters, and ruby to 2 of them"
   2.782 +      src="text-emphasis-ruby.png" width="134" height="50"></p>
   2.783 +    <p class="caption">Emphasis marks applied to 4 characters, and ruby to 2 of them</p>
   2.784 +  </div>
   2.785 +
   2.786 +  <p class="note">A future level of CSS may define controls to specify
   2.787 +    what to do when emphasis marks and ruby text coincide.</p>
   2.788 +
   2.789 +<h4 id="text-emphasis-color-property">
   2.790 +Emphasis Mark Color: the 'text-emphasis-color' property</h4>
   2.791 +
   2.792 +  <table class="propdef">
   2.793 +    <tr>
   2.794 +      <th>Name:
   2.795 +      <td><dfn>text-emphasis-color</dfn>
   2.796 +    <tr>
   2.797 +      <th><a href="#values">Value</a>:
   2.798 +      <td>&lt;color&gt;
   2.799 +    <tr>
   2.800 +      <th>Initial:
   2.801 +      <td><a href="http://www.w3.org/TR/css3-color/#currentcolor">currentColor</a>
   2.802 +    <tr>
   2.803 +      <th>Applies to:
   2.804 +      <td>all elements
   2.805 +    <tr>
   2.806 +      <th>Inherited:
   2.807 +      <td>yes
   2.808 +    <tr>
   2.809 +      <th>Percentages:
   2.810 +      <td>N/A
   2.811 +    <tr>
   2.812 +      <th>Media:
   2.813 +      <td>visual
   2.814 +    <tr>
   2.815 +      <th>Computed&#160;value:
   2.816 +      <td>as specified
   2.817 +  </table>
   2.818 +
   2.819 +  <p>This property specifies the foreground color of the emphasis marks.</p>
   2.820 +
   2.821 +  <p class="note">
   2.822 +    The correct behavior of this property depends on an outstanding erratum on [[CSS3COLOR]]
   2.823 +    that has the ''currentColor'' keyword inherit as itself,
   2.824 +    and to take the value of the 'color' property as its <em>used</em> (not computed) value.
   2.825 +
   2.826 +<h4 id="text-emphasis-property">
   2.827 +Emphasis Mark Shorthand: the 'text-emphasis' property</h4>
   2.828 +
   2.829 +  <table class="propdef">
   2.830 +    <tr>
   2.831 +      <th>Name:
   2.832 +      <td><dfn>text-emphasis</dfn>
   2.833 +    <tr>
   2.834 +      <th><a href="#values">Value</a>:
   2.835 +      <td>'&lt;<a href="#text-emphasis-style">text-emphasis-style</a>&gt;' || '&lt;<a href="#text-emphasis-color">text-emphasis-color</a>&gt;'
   2.836 +
   2.837 +    <tr>
   2.838 +      <th>Initial:
   2.839 +      <td>see individual properties
   2.840 +    <tr>
   2.841 +      <th>Applies to:
   2.842 +      <td>all elements
   2.843 +    <tr>
   2.844 +      <th>Inherited:
   2.845 +      <td>yes
   2.846 +    <tr>
   2.847 +      <th>Percentages:
   2.848 +      <td>N/A
   2.849 +    <tr>
   2.850 +      <th>Media:
   2.851 +      <td>visual
   2.852 +    <tr>
   2.853 +      <th>Computed&#160;value:
   2.854 +      <td>see individual properties
   2.855 +  </table>
   2.856 +
   2.857 +  <p>This property is a shorthand for setting
   2.858 +    'text-emphasis-style' and 'text-emphasis-color'
   2.859 +    in one declaration.
   2.860 +    Omitted values are set to their initial values.</p>
   2.861 +
   2.862 +  <p class="note">Note that 'text-emphasis-position' is not reset in this
   2.863 +    shorthand. This is because typically the shape and color vary, but the
   2.864 +    position is consistent for a particular language throughout the document.
   2.865 +    Therefore the position should inherit independently.</p>
   2.866 +
   2.867 +<h4 id="text-emphasis-position-property">
   2.868 +Emphasis Mark Position: the 'text-emphasis-position' property</h4>
   2.869 +
   2.870 +  <table class="propdef">
   2.871 +    <tr>
   2.872 +      <th>Name:
   2.873 +      <td><dfn>text-emphasis-position</dfn>
   2.874 +    <tr>
   2.875 +      <th><a href="#values">Value</a>:
   2.876 +      <td>[ above | below ] && [ right | left ]
   2.877 +
   2.878 +    <tr>
   2.879 +      <th>Initial:
   2.880 +      <td>above right
   2.881 +    <tr>
   2.882 +      <th>Applies to:
   2.883 +      <td>all elements
   2.884 +    <tr>
   2.885 +      <th>Inherited:
   2.886 +      <td>yes
   2.887 +    <tr>
   2.888 +      <th>Percentages:
   2.889 +      <td>N/A
   2.890 +    <tr>
   2.891 +      <th>Media:
   2.892 +      <td>visual
   2.893 +    <tr>
   2.894 +      <th>Computed&#160;value:
   2.895 +      <td>as specified
   2.896 +  </table>
   2.897 +
   2.898 +  <p>This property describes where emphasis marks are drawn at.
   2.899 +    The values have following meanings:</p>
   2.900 +
   2.901 +  <dl>
   2.902 +    <dt><dfn title="text-emphasis:above">''above''</dfn></dt>
   2.903 +      <dd>Draw marks over the text in horizontal writing mode.</dd>
   2.904 +    <dt><dfn title="text-emphasis:below">''below''</dfn></dt>
   2.905 +      <dd>Draw marks under the text in horizontal writing mode.</dd>
   2.906 +    <dt><dfn title="text-emphasis:right">''right''</dfn></dt>
   2.907 +      <dd>Draw marks to the right of the text in vertical writing mode.</dd>
   2.908 +    <dt><dfn title="text-emphasis:left">''left''</dfn></dt>
   2.909 +      <dd>Draw marks to the left of the text in vertical writing mode.</dd>
   2.910 +  </dl>
   2.911 +
   2.912 +  <p class="issue">
   2.913 +    Should ''above''/''below'' be ''over''/''under'' to match text decoration names?
   2.914 +
   2.915 +  <p>Emphasis marks are drawn exactly as if each character was
   2.916 +    assigned the mark as its ruby annotation text with the ruby position
   2.917 +    given by 'text-emphasis-position' and the ruby alignment as centered.
   2.918 +
   2.919 +  <p>The effect of emphasis marks on the line height is the same as for
   2.920 +    ruby text.</p>
   2.921 +
   2.922 +  <div class="note">
   2.923 +    <p>Note, the preferred position of emphasis marks depends on the
   2.924 +      language. In Japanese for example, the preferred position is
   2.925 +      ''above right''. In Chinese, on the other hand, the preferred
   2.926 +      position is ''below right''.
   2.927 +      The informative table below summarizes the preferred
   2.928 +      emphasis mark positions for Chinese and Japanese:</p>
   2.929 +
   2.930 +    <table class="data">
   2.931 +      <caption>Preferred emphasis mark and ruby position</caption>
   2.932 +      <thead>
   2.933 +        <tr>
   2.934 +          <th scope="col" rowspan=2>Language
   2.935 +          <th scope="col" colspan=2>Preferred mark position
   2.936 +          <th scope="col" colspan=2 rowspan=2>Illustration
   2.937 +        <tr>
   2.938 +          <th>Horizontal
   2.939 +          <th>Vertical
   2.940 +      </thead>
   2.941 +      <tbody>
   2.942 +        <tr>
   2.943 +          <td scope="row">Japanese
   2.944 +          <td>above
   2.945 +          <td>right
   2.946 +          <td>
   2.947 +              <img alt="Emphasis marks appear above each emphasized character in horizontal Japanese text."
   2.948 +                  title="Emphasis (shown in blue for clarity) applied above a fragment of Japanese text"
   2.949 +                  src="text-emphasis-ja.gif" height="28" width="225">
   2.950 +
   2.951 +          <td rowspan="2">
   2.952 +              <img alt="Emphasis marks appear on the right of each emphasized character in vertical Japanese text."
   2.953 +                  title="Emphasis applied on the right of a fragment of Japanese text"
   2.954 +                  src="text-emphasis-v.gif" height="89" width="34">
   2.955 +
   2.956 +        <!--
   2.957 +        <tr>
   2.958 +          <td scope="row">Mongolian
   2.959 +          <td><span class="issue">?</span>
   2.960 +          <td>right
   2.961 +        -->
   2.962 +        <tr>
   2.963 +          <td scope="row">Chinese
   2.964 +          <td>below
   2.965 +          <td>right
   2.966 +          <td>
   2.967 +            <img alt="Emphasis marks appear below each emphasized character in horizontal Simplified Chinese text."
   2.968 +                  title="Emphasis (shown in blue for clarity) applied below a fragment of Chinese text"
   2.969 +                  src="text-emphasis-zh.gif" height="28" width="133">
   2.970 +      </tbody>
   2.971 +    </table>
   2.972 +  </div>
   2.973 +
   2.974 +<h3 id="text-shadow-property">
   2.975 +Text Shadows: the 'text-shadow' property</h3>
   2.976 +
   2.977 +  <table class="propdef">
   2.978 +    <tr>
   2.979 +      <th>Name:
   2.980 +      <td><dfn>text-shadow</dfn>
   2.981 +    <tr>
   2.982 +      <th><a href="#values">Value</a>:
   2.983 +      <td>none | [ &lt;length>{2,3} && &lt;color>? ]#
   2.984 +    <tr>
   2.985 +      <th>Initial:
   2.986 +      <td>none
   2.987 +    <tr>
   2.988 +      <th>Applies to:
   2.989 +      <td>all elements
   2.990 +    <tr>
   2.991 +      <th>Inherited:
   2.992 +      <td>yes
   2.993 +    <tr>
   2.994 +      <th>Percentages:
   2.995 +      <td>N/A
   2.996 +    <tr>
   2.997 +      <th>Media:
   2.998 +      <td>visual
   2.999 +    <tr>
  2.1000 +      <th>Computed&#160;value:
  2.1001 +      <td>a color plus three absolute &lt;length&gt;s
  2.1002 +  </table>
  2.1003 +
  2.1004 +  <p>This property accepts a comma-separated list of shadow effects to
  2.1005 +    be applied to the text of the element. Values are interpreted as for
  2.1006 +    <a href="http://www.w3.org/TR/css3-background/#the-box-shadow">'box-shadow'</a>
  2.1007 +    [[!CSS3BG]]. (But note that spread values are not allowed.)
  2.1008 +    The shadow is applied to all of the element's text as well as any
  2.1009 +    text decorations it specifies.
  2.1010 +
  2.1011 +  <p>The shadow effects are applied front-to-back: the first shadow is on
  2.1012 +    top. The shadows may thus overlay each other, but they never overlay
  2.1013 +    the text itself. The shadow must be painted at a stack level between
  2.1014 +    the element's border and/or background, if present, and the elements
  2.1015 +    text and text decoration. UAs should avoid painting text shadows over
  2.1016 +    text in adjacent elements belonging to the same stack level and stacking
  2.1017 +    context. (This may mean that the exact stack level of the shadows depends
  2.1018 +    on whether the element has a border or background: the exact stacking
  2.1019 +    behavior of text shadows is thus UA-defined.)</p>
  2.1020 +
  2.1021 +  <p>Unlike 'box-shadow', text shadows are not clipped to the shadowed
  2.1022 +    shape and may show through if the text is partially-transparent.
  2.1023 +    Like 'box-shadow', text shadows do not influence layout, and do not
  2.1024 +    trigger scrolling or increase the size of the scrollable area.
  2.1025 +
  2.1026 +  <p class="note">The painting order of shadows defined here is the opposite
  2.1027 +    of that defined in the 1998
  2.1028 +    <a href="http://www.w3.org/TR/1998/REC-CSS2-19980512">CSS2 Recommendation</a>.</p>
  2.1029 +
  2.1030 +  <p>The ''text-shadow'' property applies to both the
  2.1031 +    <code>::first-line</code> and <code>::first-letter</code>
  2.1032 +    pseudo-elements.</p>
  2.1033 +
  2.1034 +<h2 id="conformance">
  2.1035 +Conformance</h2>
  2.1036 +
  2.1037 +<h3 id="conventions">
  2.1038 +Document Conventions</h3>
  2.1039 +
  2.1040 +  <p>Conformance requirements are expressed with a combination of
  2.1041 +  descriptive assertions and RFC 2119 terminology. The key words “MUST”,
  2.1042 +  “MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”, “SHOULD NOT”,
  2.1043 +  “RECOMMENDED”, “MAY”, and “OPTIONAL” in the normative parts of this
  2.1044 +  document are to be interpreted as described in RFC 2119.
  2.1045 +  However, for readability, these words do not appear in all uppercase
  2.1046 +  letters in this specification.
  2.1047 +
  2.1048 +  <p>All of the text of this specification is normative except sections
  2.1049 +  explicitly marked as non-normative, examples, and notes. [[!RFC2119]]</p>
  2.1050 +
  2.1051 +  <p>Examples in this specification are introduced with the words “for example”
  2.1052 +  or are set apart from the normative text with <code>class="example"</code>,
  2.1053 +  like this:
  2.1054 +
  2.1055 +  <div class="example">
  2.1056 +    <p>This is an example of an informative example.</p>
  2.1057 +  </div>
  2.1058 +
  2.1059 +  <p>Informative notes begin with the word “Note” and are set apart from the
  2.1060 +  normative text with <code>class="note"</code>, like this:
  2.1061 +
  2.1062 +  <p class="note">Note, this is an informative note.</p>
  2.1063 +
  2.1064 +<h3 id="conformance-classes">
  2.1065 +Conformance Classes</h3>
  2.1066 +
  2.1067 +  <p>Conformance to CSS Text Level 3
  2.1068 +  is defined for three conformance classes:
  2.1069 +  <dl>
  2.1070 +    <dt><dfn title="style sheet!!as conformance class">style sheet</dfn>
  2.1071 +      <dd>A <a href="http://www.w3.org/TR/CSS21/conform.html#style-sheet">CSS
  2.1072 +      style sheet</a>.
  2.1073 +    <dt><dfn>renderer</dfn></dt>
  2.1074 +      <dd>A <a href="http://www.w3.org/TR/CSS21/conform.html#user-agent">UA</a>
  2.1075 +      that interprets the semantics of a style sheet and renders
  2.1076 +      documents that use them.
  2.1077 +    <dt><dfn id="authoring-tool">authoring tool</dfn></dt>
  2.1078 +      <dd>A <a href="http://www.w3.org/TR/CSS21/conform.html#user-agent">UA</a>
  2.1079 +      that writes a style sheet.
  2.1080 +  </dl>
  2.1081 +
  2.1082 +  <p>A style sheet is conformant to CSS Text Level 3
  2.1083 +  if all of its declarations that use properties defined in this module
  2.1084 +  have values that are valid according to the generic CSS grammar and the
  2.1085 +  individual grammars of each property as given in this module.
  2.1086 +
  2.1087 +  <p>A renderer is conformant to CSS Text Level 3
  2.1088 +  if, in addition to interpreting the style sheet as defined by the
  2.1089 +  appropriate specifications, it supports all the features defined
  2.1090 +  by CSS Text Level 3 by parsing them correctly
  2.1091 +  and rendering the document accordingly. However, the inability of a
  2.1092 +  UA to correctly render a document due to limitations of the device
  2.1093 +  does not make the UA non-conformant. (For example, a UA is not
  2.1094 +  required to render color on a monochrome monitor.)
  2.1095 +
  2.1096 +  <p>An authoring tool is conformant to CSS Text Level 3
  2.1097 +  if it writes style sheets that are syntactically correct according to the
  2.1098 +  generic CSS grammar and the individual grammars of each feature in
  2.1099 +  this module, and meet all other conformance requirements of style sheets
  2.1100 +  as described in this module.
  2.1101 +
  2.1102 +<h3 id="partial">
  2.1103 +Partial Implementations</h3>
  2.1104 +
  2.1105 +  <p>So that authors can exploit the forward-compatible parsing rules to
  2.1106 +  assign fallback values, CSS renderers <strong>must</strong>
  2.1107 +  treat as invalid (and <a href="http://www.w3.org/TR/CSS21/conform.html#ignore">ignore
  2.1108 +  as appropriate</a>) any at-rules, properties, property values, keywords,
  2.1109 +  and other syntactic constructs for which they have no usable level of
  2.1110 +  support. In particular, user agents <strong>must not</strong> selectively
  2.1111 +  ignore unsupported component values and honor supported values in a single
  2.1112 +  multi-value property declaration: if any value is considered invalid
  2.1113 +  (as unsupported values must be), CSS requires that the entire declaration
  2.1114 +  be ignored.</p>
  2.1115 +
  2.1116 +<h3 id="experimental">
  2.1117 +Experimental Implementations</h3>
  2.1118 +
  2.1119 +  <p>To avoid clashes with future CSS features, the CSS2.1 specification
  2.1120 +  reserves a <a href="http://www.w3.org/TR/CSS21/syndata.html#vendor-keywords">prefixed
  2.1121 +  syntax</a> for proprietary and experimental extensions to CSS.
  2.1122 +
  2.1123 +  <p>Prior to a specification reaching the Candidate Recommendation stage
  2.1124 +  in the W3C process, all implementations of a CSS feature are considered
  2.1125 +  experimental. The CSS Working Group recommends that implementations
  2.1126 +  use a vendor-prefixed syntax for such features, including those in
  2.1127 +  W3C Working Drafts. This avoids incompatibilities with future changes
  2.1128 +  in the draft.
  2.1129 +  </p>
  2.1130 +
  2.1131 +<h3 id="testing">Non-Experimental Implementations</h3>
  2.1132 +
  2.1133 +  <p>Once a specification reaches the Candidate Recommendation stage,
  2.1134 +  non-experimental implementations are possible, and implementors should
  2.1135 +  release an unprefixed implementation of any CR-level feature they
  2.1136 +  can demonstrate to be correctly implemented according to spec.
  2.1137 +
  2.1138 +  <p>To establish and maintain the interoperability of CSS across
  2.1139 +  implementations, the CSS Working Group requests that non-experimental
  2.1140 +  CSS renderers submit an implementation report (and, if necessary, the
  2.1141 +  testcases used for that implementation report) to the W3C before
  2.1142 +  releasing an unprefixed implementation of any CSS features. Testcases
  2.1143 +  submitted to W3C are subject to review and correction by the CSS
  2.1144 +  Working Group.
  2.1145 +
  2.1146 +  <p>Further information on submitting testcases and implementation reports
  2.1147 +  can be found from on the CSS Working Group's website at
  2.1148 +  <a href="http://www.w3.org/Style/CSS/Test/">http://www.w3.org/Style/CSS/Test/</a>.
  2.1149 +  Questions should be directed to the
  2.1150 +  <a href="http://lists.w3.org/Archives/Public/public-css-testsuite">public-css-testsuite@w3.org</a>
  2.1151 +  mailing list.
  2.1152 +
  2.1153 +<h3 id="cr-exit-criteria">
  2.1154 +CR Exit Criteria</h3>
  2.1155 +
  2.1156 +  <p>
  2.1157 +  For this specification to be advanced to Proposed Recommendation,
  2.1158 +  there must be at least two independent, interoperable implementations
  2.1159 +  of each feature. Each feature may be implemented by a different set of
  2.1160 +  products, there is no requirement that all features be implemented by
  2.1161 +  a single product. For the purposes of this criterion, we define the
  2.1162 +  following terms:
  2.1163 +
  2.1164 +  <dl>
  2.1165 +    <dt>independent <dd>each implementation must be developed by a
  2.1166 +    different party and cannot share, reuse, or derive from code
  2.1167 +    used by another qualifying implementation. Sections of code that
  2.1168 +    have no bearing on the implementation of this specification are
  2.1169 +    exempt from this requirement.
  2.1170 +
  2.1171 +    <dt>interoperable <dd>passing the respective test case(s) in the
  2.1172 +    official CSS test suite, or, if the implementation is not a Web
  2.1173 +    browser, an equivalent test. Every relevant test in the test
  2.1174 +    suite should have an equivalent test created if such a user
  2.1175 +    agent (UA) is to be used to claim interoperability. In addition
  2.1176 +    if such a UA is to be used to claim interoperability, then there
  2.1177 +    must one or more additional UAs which can also pass those
  2.1178 +    equivalent tests in the same way for the purpose of
  2.1179 +    interoperability. The equivalent tests must be made publicly
  2.1180 +    available for the purposes of peer review.
  2.1181 +
  2.1182 +    <dt>implementation <dd>a user agent which:
  2.1183 +
  2.1184 +    <ol class=inline>
  2.1185 +      <li>implements the specification.
  2.1186 +
  2.1187 +      <li>is available to the general public. The implementation may
  2.1188 +      be a shipping product or other publicly available version
  2.1189 +      (i.e., beta version, preview release, or “nightly build”).
  2.1190 +      Non-shipping product releases must have implemented the
  2.1191 +      feature(s) for a period of at least one month in order to
  2.1192 +      demonstrate stability.
  2.1193 +
  2.1194 +      <li>is not experimental (i.e., a version specifically designed
  2.1195 +      to pass the test suite and is not intended for normal usage
  2.1196 +      going forward).
  2.1197 +    </ol>
  2.1198 +  </dl>
  2.1199 +
  2.1200 +  <p>The specification will remain Candidate Recommendation for at least
  2.1201 +  six months.
  2.1202 +
  2.1203 +<h2 class="no-num" id="acknowledgements">
  2.1204 +  Appendix A: Acknowledgements</h2>
  2.1205 +
  2.1206 +  <p>This specification would not have been possible without the help from:
  2.1207 +    Ayman Aldahleh, Bert Bos, Tantek Çelik, Stephen Deach, John Daggett,
  2.1208 +    Martin Dürst,
  2.1209 +    Laurie Anna Edlund, Ben Errez, Yaniv Feinberg, Arye Gittelman, Ian
  2.1210 +    Hickson, Martin Heijdra, Richard Ishida, Masayasu Ishikawa,
  2.1211 +    Michael Jochimsen, Eric LeVine, Ambrose Li, Håkon Wium Lie, Chris Lilley,
  2.1212 +    Ken Lunde, Nat McCully, Shinyu Murakami, Paul Nelson, Chris Pratley, Marcin Sawicki,
  2.1213 +    Arnold Schrijver, Rahul Sonnad, Michel Suignard, Takao Suzuki,
  2.1214 +    Frank Tang, Chris Thrasher, Etan Wexler, Chris Wilson, Masafumi Yabe
  2.1215 +    and Steve Zilles.</p>
  2.1216 +
  2.1217 +<h2 class="no-num">Appendix B: References</h2>
  2.1218 +
  2.1219 +<h3 class="no-num" id="normative-ref">Normative references</h3>
  2.1220 +<!--normative-->
  2.1221 +
  2.1222 +<h3 class="no-num" id="informative-ref">Informative references</h3>
  2.1223 +<!--informative-->
  2.1224 +
  2.1225 +<h2 class="no-num" id="changes">Appendix C:
  2.1226 +Changes</h2>

     3.1 --- a/css3-text/Overview.html	Wed Sep 05 14:51:46 2012 -0700
     3.2 +++ b/css3-text/Overview.html	Wed Sep 05 14:53:15 2012 -0700
     3.3 @@ -1,12 +1,26 @@
     3.4 -<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
     3.5 -"http://www.w3.org/TR/html4/strict.dtd">
     3.6 +<!DOCTYPE html>
     3.7  
     3.8  <html lang=en>
     3.9 - <head><meta content="text/html; charset=utf-8" http-equiv=Content-Type>
    3.10 -
    3.11 -  <title>CSS Text Level 3</title>
    3.12 + <head profile="http://dublincore.org/documents/2008/08/04/dc-html/ ">
    3.13 +  <meta content="text/html; charset=utf-8" http-equiv=Content-Type>
    3.14 +  <title>CSS Text Module Level 3 (CSS3 Text)</title>
    3.15 +
    3.16 +  <link href="http://purl.org/dc/terms/" rel=schema.DC>
    3.17 +  <meta content="CSS Text Module Level 3 (CSS3 Text)" name=DC.title>
    3.18 +  <meta content=text name=DC.type>
    3.19 +  <meta content=2012-09-05 name=DC.issued>
    3.20 +  <meta content="Elika J. Etemad" name=DC.creator>
    3.21 +  <meta content="Koji Ishii" name=DC.creator>
    3.22 +  <meta content=W3C name=DC.publisher>
    3.23 +  <meta content="http://www.w3.org/TR/2012/WD-css3-text-20120905/"
    3.24 +   name=DC.identifier>
    3.25 +  <link href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright"
    3.26 +   rel=DC.rights>
    3.27 +  <link href="#contents" rel=contents>
    3.28 +  <link href="#index" rel=index>
    3.29    <link href="../default.css" rel=stylesheet type="text/css">
    3.30 -
    3.31 +  <link href="http://www.w3.org/StyleSheets/TR/W3C-WD.css" rel=stylesheet
    3.32 +   type="text/css">
    3.33    <style type="text/css">
    3.34      .egbidiwsaA,.egbidiwsbB,.egbidiwsaB,.egbidiwsbC
    3.35        { white-space:pre;font-size:80%;font-family:monospace; vertical-align:2px; margin:1px }
    3.36 @@ -23,16 +37,16 @@
    3.37      }
    3.38    </style>
    3.39    <link href="http://www.w3.org/StyleSheets/TR/W3C-WD.css" rel=stylesheet
    3.40 -  type="text/css">
    3.41 +   type="text/css">
    3.42  
    3.43   <body>
    3.44    <div class=head> <!--begin-logo-->
    3.45     <p><a href="http://www.w3.org/"><img alt=W3C height=48
    3.46      src="http://www.w3.org/Icons/w3c_home" width=72></a> <!--end-logo-->
    3.47  
    3.48 -   <h1>CSS Text Level 3</h1>
    3.49 -
    3.50 -   <h2 class="no-num no-toc" id=longstatus-date>W3C Working Draft 29 August
    3.51 +   <h1>CSS Text Module Level 3</h1>
    3.52 +
    3.53 +   <h2 class="no-num no-toc" id=longstatus-date>W3C Working Draft 5 September
    3.54      2012</h2>
    3.55  
    3.56     <dl>
    3.57 @@ -42,7 +56,7 @@
    3.58    -->
    3.59  
    3.60      <dd><a
    3.61 -     href="http://www.w3.org/TR/2012/WD-css3-text-20120829/">http://www.w3.org/TR/2012/WD-css3-text-20120829/</a>
    3.62 +     href="http://www.w3.org/TR/2012/WD-css3-text-20120905/">http://www.w3.org/TR/2012/WD-css3-text-20120905/</a>
    3.63  
    3.64      <dt>Latest version:
    3.65  
    3.66 @@ -58,13 +72,11 @@
    3.67  
    3.68      <dd><a
    3.69       href="http://www.w3.org/TR/2012/WD-css3-text-20120119/">http://www.w3.org/TR/2012/WD-css3-text-20120119/</a>
    3.70 -     
    3.71  
    3.72      <dt>Issues List:
    3.73  
    3.74      <dd><a
    3.75       href="http://www.w3.org/Style/CSS/Tracker/products/10">http://www.w3.org/Style/CSS/Tracker/products/10</a>
    3.76 -     
    3.77  
    3.78      <dt>Discussion:
    3.79  
    3.80 @@ -105,7 +117,7 @@
    3.81  
    3.82    <p>This CSS3 module defines properties for text manipulation and specifies
    3.83     their processing model. It covers line breaking, justification and
    3.84 -   alignment, white space handling, text decoration and text transformation.
    3.85 +   alignment, white space handling, and text transformation.
    3.86  
    3.87    <h2 class="no-num no-toc" id=status>Status of This Document</h2>
    3.88  
    3.89 @@ -168,9 +180,8 @@
    3.90     <li>the percentage values of ‘<a href="#word-spacing0"><code
    3.91      class=property>word-spacing</code></a>’
    3.92  
    3.93 -   <li>the ‘<a href="#text-decoration-skip0"><code
    3.94 -    class=property>text-decoration-skip</code></a>’ property / ‘<code
    3.95 -    class=css>ink</code>’ value
    3.96 +   <li>the ‘<code class=property>text-decoration-skip</code>’ property /
    3.97 +    ‘<code class=css>ink</code>’ value
    3.98  
    3.99     <li><span class=issue>audit draft and add more here</span>
   3.100    </ul>
   3.101 @@ -261,7 +272,6 @@
   3.102  
   3.103       <li><a href="#text-justify"><span class=secno>7.3. </span> Justification
   3.104        Method: the ‘<code class=property>text-justify</code>’ property</a>
   3.105 -      
   3.106      </ul>
   3.107  
   3.108     <li><a href="#spacing"><span class=secno>8. </span> Spacing</a>
   3.109 @@ -286,58 +296,6 @@
   3.110  
   3.111     <li><a href="#decoration"><span class=secno>10. </span> Text
   3.112      Decoration</a>
   3.113 -    <ul class=toc>
   3.114 -     <li><a href="#line-decoration"><span class=secno>10.1. </span> Line
   3.115 -      Decoration: Underline, Overline, and Strike-Through</a>
   3.116 -      <ul class=toc>
   3.117 -       <li><a href="#text-decoration-line"><span class=secno>10.1.1. </span>
   3.118 -        Text Decoration Lines: the ‘<code
   3.119 -        class=property>text-decoration-line</code>’ property</a>
   3.120 -
   3.121 -       <li><a href="#text-decoration-color"><span class=secno>10.1.2. </span>
   3.122 -        Text Decoration Color: the ‘<code
   3.123 -        class=property>text-decoration-color</code>’ property</a>
   3.124 -
   3.125 -       <li><a href="#text-decoration-style"><span class=secno>10.1.3. </span>
   3.126 -        Text Decoration Style: the ‘<code
   3.127 -        class=property>text-decoration-style</code>’ property</a>
   3.128 -
   3.129 -       <li><a href="#text-decoration"><span class=secno>10.1.4. </span> Text
   3.130 -        Decoration Shorthand: the ‘<code
   3.131 -        class=property>text-decoration</code>’ property</a>
   3.132 -
   3.133 -       <li><a href="#text-decoration-skip"><span class=secno>10.1.5. </span>
   3.134 -        Text Decoration Line Continuity: the ‘<code
   3.135 -        class=property>text-decoration-skip</code>’ property</a>
   3.136 -
   3.137 -       <li><a href="#text-underline-position"><span class=secno>10.1.6.
   3.138 -        </span> Text Underline Position: the ‘<code
   3.139 -        class=property>text-underline-position</code>’ property</a>
   3.140 -      </ul>
   3.141 -
   3.142 -     <li><a href="#emphasis-marks"><span class=secno>10.2. </span> Emphasis
   3.143 -      Marks</a>
   3.144 -      <ul class=toc>
   3.145 -       <li><a href="#text-emphasis-style"><span class=secno>10.2.1. </span>
   3.146 -        Emphasis Mark Style: the ‘<code
   3.147 -        class=property>text-emphasis-style</code>’ property</a>
   3.148 -
   3.149 -       <li><a href="#text-emphasis-color"><span class=secno>10.2.2. </span>
   3.150 -        Emphasis Mark Color: the ‘<code
   3.151 -        class=property>text-emphasis-color</code>’ property</a>
   3.152 -
   3.153 -       <li><a href="#text-emphasis"><span class=secno>10.2.3. </span>
   3.154 -        Emphasis Mark Shorthand: the ‘<code
   3.155 -        class=property>text-emphasis</code>’ property</a>
   3.156 -
   3.157 -       <li><a href="#text-emphasis-position"><span class=secno>10.2.4.
   3.158 -        </span> Emphasis Mark Position: the ‘<code
   3.159 -        class=property>text-emphasis-position</code>’ property</a>
   3.160 -      </ul>
   3.161 -
   3.162 -     <li><a href="#text-shadow"><span class=secno>10.3. </span> Text Shadows:
   3.163 -      the ‘<code class=property>text-shadow</code>’ property</a>
   3.164 -    </ul>
   3.165  
   3.166     <li><a href="#conformance"><span class=secno>11. </span> Conformance</a>
   3.167      <ul class=toc>
   3.168 @@ -373,8 +331,8 @@
   3.169  
   3.170     <li class=no-num><a href="#changes">Appendix C: Changes</a>
   3.171      <ul class=toc>
   3.172 -     <li class=no-num><a href="#recent-changes"> Changes from the January
   3.173 -      2012 CSS3 Text <abbr title="Working Draft">WD</abbr></a>
   3.174 +     <li class=no-num><a href="#recent-changes"> Changes from the August 2012
   3.175 +      CSS3 Text <abbr title="Working Draft">WD</abbr></a>
   3.176      </ul>
   3.177  
   3.178     <li class=no-num><a href="#default-stylesheet">Appendix D: Default UA
   3.179 @@ -427,17 +385,6 @@
   3.180     keyword as their property value. For readability it has not been repeated
   3.181     explicitly.
   3.182  
   3.183 -  <p>The <dfn id=currentcolor>‘<code class=css>currentcolor</code>’</dfn>
   3.184 -   keyword here computes to itself and is resolved to the value of ‘<code
   3.185 -   class=property>color</code>’ after inheritance is performed. This is so
   3.186 -   that the ‘<a href="#text-emphasis-color0"><code
   3.187 -   class=property>text-emphasis-color</code></a>’ by default matches the
   3.188 -   text ‘<code class=property>color</code>’. <span class=issue>CSS3 Color
   3.189 -   has not yet been errata'd to define it this way; currentcolor there is
   3.190 -   defined to compute to the value of ‘<code
   3.191 -   class=property>color</code>’, which gives it the wrong inheritance
   3.192 -   behavior.</span>
   3.193 -
   3.194    <h3 id=terms><span class=secno>1.3. </span> Terminology</h3>
   3.195  
   3.196    <p id=grapheme-cluster>A <dfn id=grapheme-cluster0>grapheme cluster</dfn>
   3.197 @@ -580,7 +527,6 @@
   3.198            so that it is accessible and can be styled correctly
   3.199            when not presented as ruby.
   3.200  -->
   3.201 -    
   3.202    </dl>
   3.203  
   3.204    <p>The case mapping rules for the character repertoire specified by the
   3.205 @@ -595,7 +541,6 @@
   3.206     applied as well. These minimally include, but are not limited to, the
   3.207     language-specific rules in Unicode's <a
   3.208     href="http://www.unicode.org/Public/UNIDATA/SpecialCasing.txt">SpecialCasing.txt</a>.
   3.209 -   
   3.210  
   3.211    <div class=example>
   3.212     <p>For example, in Turkish there are two “i”s, one with a
   3.213 @@ -659,7 +604,6 @@
   3.214        require authors needing this functionality to copy out the conversion
   3.215        tables, however.
   3.216  -->
   3.217 -   
   3.218  
   3.219    <h2 id=white-space><span class=secno>3. </span><a
   3.220     id=white-space-collapsing></a><a id=text-wrap></a> White Space and
   3.221 @@ -916,7 +860,7 @@
   3.222       class=css>normal</code>’, ‘<code class=css>nowrap</code>’, or
   3.223       ‘<code class=css>pre-line</code>’, white space characters are
   3.224       considered <dfn id=collapsible>collapsible</dfn> and are processed by
   3.225 -     performing the following steps:</p>
   3.226 +     performing the following steps:
   3.227  
   3.228      <ol>
   3.229       <li>All spaces and tabs immediately preceding or following a segment
   3.230 @@ -979,7 +923,7 @@
   3.231      bidirectionality with white space collapsing</h4>
   3.232  
   3.233     <p>Consider the following markup fragment, taking special note of spaces
   3.234 -    (with varied backgrounds and borders for emphasis and identification):</p>
   3.235 +    (with varied backgrounds and borders for emphasis and identification):
   3.236  
   3.237     <pre><code>&lt;ltr&gt;A<span class=egbidiwsaA> </span>&lt;rtl&gt;<span
   3.238      class=egbidiwsbB> </span>B<span
   3.239 @@ -991,7 +935,7 @@
   3.240      right-to-left embedding. If the ‘<code
   3.241      class=property>text-space-collapse</code>’ property is set to ‘<code
   3.242      class=css>collapse</code>’, the above processing model would result in
   3.243 -    the following:</p>
   3.244 +    the following:
   3.245  
   3.246     <ul style="line-height:1.3">
   3.247      <li>The space before the B (<span class=egbidiwsbB> </span>) would
   3.248 @@ -1004,14 +948,14 @@
   3.249     <p>This would leave two spaces, one after the A in the left-to-right
   3.250      embedding level, and one after the B in the right-to-left embedding
   3.251      level. This is then ordered according to the Unicode bidirectional
   3.252 -    algorithm, with the end result being:</p>
   3.253 +    algorithm, with the end result being:
   3.254  
   3.255     <pre>A<span class=egbidiwsaA> </span><span class=egbidiwsaB> </span>BC</pre>
   3.256  
   3.257     <p>Note that there are two spaces between A and B, and none between B and
   3.258      C. This is best avoided by putting spaces outside the element instead of
   3.259      just inside the opening and closing tags and, where practical, by relying
   3.260 -    on implicit bidirectionality instead of explicit embedding levels.</p>
   3.261 +    on implicit bidirectionality instead of explicit embedding levels.
   3.262    </div>
   3.263  
   3.264    <h4 id=line-break-transform><span class=secno>4.1.2. </span> Line Break
   3.265 @@ -1158,13 +1102,11 @@
   3.266      <!-- The CSS Working Group notes that although UAX 14 contains a wealth of
   3.267        information about line breaking conventions, a literal implementation
   3.268        of its algorithm has been found to be inadequate in multiple situations. -->
   3.269 -    
   3.270  
   3.271     <p class=issue>Any guidance for appropriate references here would be much
   3.272      appreciated. <!-- Additionally, some guidance could be provided on how
   3.273        to break or not break Southeast Asian in the absence of a dictionary.
   3.274        (See e.g. <a href="http://lists.w3.org/Archives/Public/www-style/2011Feb/0126.html">notes on Thai</a>.) -->
   3.275 -    
   3.276    </div>
   3.277  
   3.278    <h3 id=line-break-details><span class=secno>5.1. </span> Line Breaking
   3.279 @@ -1514,7 +1456,6 @@
   3.280     <!-- This is because it allows tables to hyphenate instead of overflowing,
   3.281           which is particularly important in long-word languages like German.
   3.282           https://bugzilla.mozilla.org/show_bug.cgi?id=418975 -->
   3.283 -   
   3.284  
   3.285    <h3 id=hyphens><span class=secno>6.1. </span>Hyphenation Control: the ‘<a
   3.286     href="#hyphens0"><code class=property>hyphens</code></a>’ property</h3>
   3.287 @@ -1579,7 +1520,7 @@
   3.288     <dd>Words are only hyphenated where there are characters inside the word
   3.289      that explicitly suggest hyphenation opportunities.
   3.290      <!-- Characters can be <del>explicit</del><ins>???</ins> or conditional. -->
   3.291 -    
   3.292 +
   3.293      <div class=example>
   3.294       <p>In Unicode, U+00AD is a conditional "soft hyphen" and U+2010 is an
   3.295        unconditional hyphen. Unicode Standard Annex #14 describes the <a
   3.296 @@ -1824,8 +1765,8 @@
   3.297      class=property>start</code>’ or ‘<code class=property>end</code>’
   3.298      keyword is calculated against its parent's ‘<code
   3.299      class=property>direction</code>’ value and results in a computed value
   3.300 -    of either ‘<a href="#left0"><code class=property>left</code></a>’ or
   3.301 -    ‘<a href="#right0"><code class=property>right</code></a>’.
   3.302 +    of either ‘<code class=property>left</code>’ or ‘<code
   3.303 +    class=property>right</code>’.
   3.304  
   3.305     <dt><dfn id=start-end title="text-align:start end">‘<code
   3.306      class=css>start end</code>’</dfn>
   3.307 @@ -1841,9 +1782,8 @@
   3.308    <p>A block of text is a stack of <a
   3.309     href="http://www.w3.org/TR/CSS21/visuren.html#line-box">line boxes</a>. In
   3.310     the case of ‘<code class=property>start</code>’, ‘<code
   3.311 -   class=property>end</code>’, ‘<a href="#left0"><code
   3.312 -   class=property>left</code></a>’, ‘<a href="#right0"><code
   3.313 -   class=property>right</code></a>’ and ‘<code
   3.314 +   class=property>end</code>’, ‘<code class=property>left</code>’,
   3.315 +   ‘<code class=property>right</code>’ and ‘<code
   3.316     class=property>center</code>’, this property specifies how the
   3.317     inline-level boxes within each line box align with respect to the start
   3.318     and end sides of the line box: alignment is not with respect to the <a
   3.319 @@ -1888,7 +1828,7 @@
   3.320     <p>In the following example, assuming the <code>&lt;block&gt;</code> is a
   3.321      preformatted block (‘<code class=css>display: block; white-space:
   3.322      pre</code>’) inheriting ‘<code class=css>text-align: start</code>’,
   3.323 -    every other line is right-aligned:</p>
   3.324 +    every other line is right-aligned:
   3.325  
   3.326     <pre>&lt;block style="unicode-bidi: plaintext"&gt;
   3.327  <!-- -->  Latin
   3.328 @@ -1988,7 +1928,7 @@
   3.329  <!-- -->&lt;/TABLE&gt;</pre>
   3.330  
   3.331     <p>to align along the decimal point. The table might be rendered as
   3.332 -    follows:</p>
   3.333 +    follows:
   3.334  
   3.335     <pre>
   3.336  <!-- -->+---------------------+
   3.337 @@ -2007,8 +1947,8 @@
   3.338    </div>
   3.339  
   3.340    <p>A keyword value may be specified in conjunction with the &lt;string&gt;
   3.341 -   value; if it is not given, it defaults to ’‘<a href="#right0"><code
   3.342 -   class=property>right</code></a>’‘<code class=css>. This value is used:
   3.343 +   value; if it is not given, it defaults to ’‘<code
   3.344 +   class=property>right</code>’‘<code class=css>. This value is used:
   3.345     </code>
   3.346  
   3.347    <ul>
   3.348 @@ -2019,9 +1959,8 @@
   3.349  
   3.350     <li>when a character-aligned cell spans more than one column. In this case
   3.351      the keyword alignment value is used to determine which column’s axis to
   3.352 -    align with: the leftmost column for ‘<a href="#left0"><code
   3.353 -    class=css>left</code></a>’, the rightmost column for ‘<a
   3.354 -    href="#right0"><code class=css>right</code></a>’ and ‘<code
   3.355 +    align with: the leftmost column for ‘<code class=css>left</code>’,
   3.356 +    the rightmost column for ‘<code class=css>right</code>’ and ‘<code
   3.357      class=css>center</code>’, the startmost column for ‘<code
   3.358      class=css>start</code>’, the endmost column for ‘<code
   3.359      class=css>end</code>’.
   3.360 @@ -2194,7 +2133,7 @@
   3.361       class=css>inter-word</code>’ for English. Another possibility is to
   3.362       use a justification method that is a universal compromise for all
   3.363       scripts, e.g. the ‘<code class=css>inter-cluster</code>’ method with
   3.364 -     block scripts raised to first priority.</p>
   3.365 +     block scripts raised to first priority.
   3.366  
   3.367     <dt><dfn id=none1 title="text-justify:none">‘<code
   3.368      class=css>none</code>’</dfn>
   3.369 @@ -2256,7 +2195,7 @@
   3.370     normal spacing conditions. The exact justification algorithm is
   3.371     UA-dependent; however, CSS provides some general guidelines which should
   3.372     be followed when any justification method other than ‘<a
   3.373 -   href="#auto3"><code class=property>auto</code></a>’ is specified.
   3.374 +   href="#auto1"><code class=property>auto</code></a>’ is specified.
   3.375  
   3.376    <div class=note>
   3.377     <p>The guidelines in this level of CSS do not describe a complete
   3.378 @@ -2341,7 +2280,7 @@
   3.379  
   3.380       <th>‘<code class=css>kashida</code>’
   3.381  
   3.382 -     <th>‘<a href="#auto3"><code class=css>auto</code></a>’
   3.383 +     <th>‘<a href="#auto1"><code class=css>auto</code></a>’
   3.384  
   3.385     <tbody>
   3.386      <tr>
   3.387 @@ -2451,7 +2390,7 @@
   3.388       <td>*
   3.389    </table>
   3.390  
   3.391 -  <p id=auto-justify><small>* The ‘<a href="#auto3"><code
   3.392 +  <p id=auto-justify><small>* The ‘<a href="#auto1"><code
   3.393     class=css>auto</code></a>’ column defined above is informative; it
   3.394     suggests a prioritization that presents a universal compromise among
   3.395     justification methods.</small>
   3.396 @@ -2525,13 +2464,13 @@
   3.397      class=property>text-justify</code></a>’ property is ‘<code
   3.398      class=css>inter-ideograph</code>’ and the ‘<code
   3.399      class=property>text-spacing</code>’ property does not specify ‘<code
   3.400 -    class=css>no-compress</code>’.</p>
   3.401 +    class=css>no-compress</code>’.
   3.402  
   3.403     <p>It produces an effect similar to cases where the computed value of
   3.404      ‘<code class=property>text-spacing</code>’ property does not specify
   3.405      ‘<code class=css>trim-end</code>’ or ‘<code
   3.406      class=css>space-end</code>’. If the UA wants to prohibit this behavior,
   3.407 -    rule b. of 3.8.3 should be omitted.</p>
   3.408 +    rule b. of 3.8.3 should be omitted.
   3.409  
   3.410     <p>Note that the rules described in the document specifically target
   3.411      Japanese. Therefore they may produce non-optimal results when used to
   3.412 @@ -2565,8 +2504,7 @@
   3.413                <li>Expand all expansion opportunities as defined above in equal percent of the size of each character.</li>
   3.414              </ol></li>
   3.415          </ol>
   3.416 -      -->
   3.417 -   </div>
   3.418 +      --></div>
   3.419  
   3.420    <h2 id=spacing><span class=secno>8. </span> Spacing</h2>
   3.421  
   3.422 @@ -2711,7 +2649,6 @@
   3.423    <div class=example>
   3.424     <p>The following example will make all the spaces between words in Arabic
   3.425      be rendered as zero-width, and double the width of each space in English:
   3.426 -    
   3.427  
   3.428     <pre>:lang(ar) { word-spacing: -100%; }
   3.429  <!--    -->:lang(en) { word-spacing: 100%; }</pre>
   3.430 @@ -2795,18 +2732,18 @@
   3.431     href="#character"><i>character</i></a>.
   3.432  
   3.433    <div class=example>
   3.434 -   <p>For example, given the markup</p>
   3.435 +   <p>For example, given the markup
   3.436  
   3.437     <pre>&lt;P&gt;a&lt;LS&gt;b&lt;Z&gt;cd&lt;/Z&gt;&lt;Y&gt;ef&lt;/Y&gt;&lt;/LS&gt;g&lt;/P&gt;</pre>
   3.438  
   3.439 -   <p>and the style sheet</p>
   3.440 +   <p>and the style sheet
   3.441  
   3.442     <pre><!--
   3.443       -->LS { letter-spacing: 1em; }
   3.444  <!-- -->Z { letter-spacing: 0.3em; }
   3.445  <!-- -->Y { letter-spacing: 0.4em; }</pre>
   3.446  
   3.447 -   <p>the spacing would be</p>
   3.448 +   <p>the spacing would be
   3.449  
   3.450     <pre>a[0]b[1em]c[0.3em]d[1em]e[0.4em]f[0]g</pre>
   3.451    </div>
   3.452 @@ -2931,7 +2868,7 @@
   3.453      class=property>start</code>’ and ‘<a href="#text-indent0"><code
   3.454      class=property>text-indent</code></a>’ is ‘<code
   3.455      class=css>5em</code>’ in left-to-right text with no floats present,
   3.456 -    then first line of text will start 5em into the block:</p>
   3.457 +    then first line of text will start 5em into the block:
   3.458  
   3.459     <pre><!--
   3.460         -->     Since CSS1 it has been possible
   3.461 @@ -3168,7 +3105,7 @@
   3.462    <div class=example>
   3.463     <p>The ‘<code class=css>allow-end</code>’ and ‘<code
   3.464      class=css>force-end</code>’ are two variations of hanging punctuation
   3.465 -    used in East Asia.</p>
   3.466 +    used in East Asia.
   3.467  
   3.468     <div>
   3.469      <div class=sidefigure> <img alt="hanging-punctuation: allow-end"
   3.470 @@ -3196,1209 +3133,21 @@
   3.471      class=css>allow-end</code>’ does not hang, because it fits without
   3.472      hanging. However, if ‘<code class=css>force-end</code>’ is used, it
   3.473      is forced to hang. The justification measures the line without the
   3.474 -    hanging punctuation. Therefore the line is expanded.</p>
   3.475 +    hanging punctuation. Therefore the line is expanded.
   3.476    </div>
   3.477  
   3.478    <h2 id=decoration><span class=secno>10. </span> <a
   3.479     name=text-decoration>Text Decoration</a></h2>
   3.480  
   3.481 -  <h3 id=line-decoration><span class=secno>10.1. </span> Line Decoration:
   3.482 -   Underline, Overline, and Strike-Through</h3>
   3.483 -
   3.484 -  <p>The following properties describe line decorations that are added to the
   3.485 -   content of an element. When specified on or propagated to an inline box,
   3.486 -   such decoration affects all the boxes generated by that element, and is
   3.487 -   further propagated to any in-flow block-level boxes that split the inline
   3.488 -   (see <a
   3.489 -   href="http://www.w3.org/TR/CSS21/visuren.html#anonymous-block-level">CSS2.1
   3.490 -   section 9.2.1.1</a>) When specified on or propagated to a ruby box, the
   3.491 -   decorations are further propagated only to the ruby base. When specified
   3.492 -   on or propagated to a a block container that establishes an inline
   3.493 -   formatting context, the decorations are propagated to an anonymous inline
   3.494 -   element that wraps all the in-flow inline-level children of the block
   3.495 -   container. For all other elements, the decorations are propagated to any
   3.496 -   in-flow children.
   3.497 -
   3.498 -  <p class=note>Note that text decorations are not propagated to any
   3.499 -   out-of-flow descendants, nor to the contents of atomic inline-level
   3.500 -   descendants such as inline blocks and inline tables.
   3.501 -
   3.502 -  <p>By default underlines, overlines, and line-throughs are applied only to
   3.503 -   text (including white space, letter spacing, and word spacing): margins,
   3.504 -   borders, and padding are skipped. Elements containing no text, such as
   3.505 -   images, are likewise not decorated. The ‘<a
   3.506 -   href="#text-decoration-skip0"><code
   3.507 -   class=property>text-decoration-skip</code></a>’ property can be used to
   3.508 -   modify this behavior, for example allowing inline replaced elements to be
   3.509 -   underlined or requiring that white space be skipped.
   3.510 -
   3.511 -  <p>In determining the position and thickness of text decoration lines, user
   3.512 -   agents may consider the font sizes and dominant baselines of descendants,
   3.513 -   but for a given element's decoration must use the same position and
   3.514 -   thickness throughout each line box. The <a
   3.515 -   href="#text-decoration-color">color</a> and <a
   3.516 -   href="#text-decoration-style">line style</a> of decorations must remain
   3.517 -   the same on all decorations applied by a given element, even if descendant
   3.518 -   elements have different color or line style values.
   3.519 -
   3.520 -  <div class=example>
   3.521 -   <p>The following figure shows the averaging for underline:
   3.522 -
   3.523 -   <p><img
   3.524 -    alt="In the first rendering of the underlined text '1st a'                    with 'st' as a superscript, both the '1st' and the 'a'                    are rendered in a small font. In the second rendering,                    the 'a' is rendered in a larger font. In the third, both                    '1st' and 'a' are large."
   3.525 -    height=105 src=underline-averaging.gif width=326>
   3.526 -
   3.527 -   <p>In the three fragments of underlined text, the underline is drawn
   3.528 -    consecutively lower and thicker as the ratio of large text to small text
   3.529 -    increases.</p>
   3.530 -  </div>
   3.531 -
   3.532 -  <p>Relatively positioning a descendant moves all text decorations affecting
   3.533 -   it along with the descendant's text; it does not affect calculation of the
   3.534 -   decoration's initial position on that line. The ‘<code
   3.535 -   class=property>visibility</code>’ property, filters, and other graphical
   3.536 -   transformations likewise affect text decorations as part of the text
   3.537 -   they're drawn on, even if the decorations were specified on an ancestor
   3.538 -   element. <span class=issue>Does this include ‘<a
   3.539 -   href="#text-shadow0"><code class=property>text-shadow</code></a>’? What
   3.540 -   about text-fill etc.?</span>
   3.541 -
   3.542 -  <div class=example>
   3.543 -   <p>In the following style sheet and document fragment:</p>
   3.544 -
   3.545 -   <pre><code class=css>
   3.546 -<!-- -->   blockquote { text-decoration: underline; color: blue; }
   3.547 -<!-- -->   em { display: block; }
   3.548 -<!-- -->   cite { color: fuchsia; }
   3.549 -<!----></code></pre>
   3.550 -
   3.551 -   <pre class=html><code>
   3.552 -<!-- -->   &lt;blockquote&gt;
   3.553 -<!-- -->    &lt;p&gt;
   3.554 -<!-- -->     &lt;span&gt;
   3.555 -<!-- -->      Help, help!
   3.556 -<!-- -->      &lt;em&gt; I am under a hat! &lt;/em&gt;
   3.557 -<!-- -->
   3.558 -<!-- -->      &lt;cite&gt; —GwieF &lt;/cite&gt;
   3.559 -<!-- -->     &lt;/span&gt;
   3.560 -<!-- -->    &lt;/p&gt;
   3.561 -<!-- -->   &lt;/blockquote&gt;
   3.562 -<!----></code></pre>
   3.563 -
   3.564 -   <p>...the underlining for the blockquote element is propagated to an
   3.565 -    anonymous inline element that surrounds the span element, causing the
   3.566 -    text "Help, help!" to be blue, with the blue underlining from the
   3.567 -    anonymous inline underneath it, the color being taken from the blockquote
   3.568 -    element. The <code>&lt;em&gt;text&lt;/em&gt;</code> in the em block is
   3.569 -    also underlined, as it is in an in-flow block to which the underline is
   3.570 -    propagated. The final line of text is fuchsia, but the underline
   3.571 -    underneath it is still the blue underline from the anonymous inline
   3.572 -    element.</p>
   3.573 -
   3.574 -   <p><img alt="Sample rendering of the above underline example"
   3.575 -    src=underline-example.png></p>
   3.576 -
   3.577 -   <p>This diagram shows the boxes involved in the example above. The rounded
   3.578 -    aqua line represents the anonymous inline element wrapping the inline
   3.579 -    contents of the paragraph element, the rounded blue line represents the
   3.580 -    span element, and the orange lines represent the blocks.</p>
   3.581 -  </div>
   3.582 -
   3.583 -  <h4 id=text-decoration-line><span class=secno>10.1.1. </span> Text
   3.584 -   Decoration Lines: the ‘<a href="#text-decoration-line0"><code
   3.585 -   class=property>text-decoration-line</code></a>’ property</h4>
   3.586 -
   3.587 -  <table class=propdef>
   3.588 -   <tbody>
   3.589 -    <tr>
   3.590 -     <th>Name:
   3.591 -
   3.592 -     <td><dfn id=text-decoration-line0>text-decoration-line</dfn>
   3.593 -
   3.594 -    <tr>
   3.595 -     <th><a href="#values">Value</a>:
   3.596 -
   3.597 -     <td>none | [ underline || overline || line-through ]
   3.598 -
   3.599 -    <tr>
   3.600 -     <th>Initial:
   3.601 -
   3.602 -     <td>none
   3.603 -
   3.604 -    <tr>
   3.605 -     <th>Applies to:
   3.606 -
   3.607 -     <td>all elements
   3.608 -
   3.609 -    <tr>
   3.610 -     <th>Inherited:
   3.611 -
   3.612 -     <td>no (but see prose)
   3.613 -
   3.614 -    <tr>
   3.615 -     <th>Percentages:
   3.616 -
   3.617 -     <td>N/A
   3.618 -
   3.619 -    <tr>
   3.620 -     <th>Media:
   3.621 -
   3.622 -     <td>visual
   3.623 -
   3.624 -    <tr>
   3.625 -     <th>Computed value:
   3.626 -
   3.627 -     <td>as specified
   3.628 -  </table>
   3.629 -
   3.630 -  <p>Specifies what line decorations, if any, are added to the element.
   3.631 -   Values have the following meanings:
   3.632 -
   3.633 -  <dl>
   3.634 -   <dt><dfn id=none3 title="text-decoration-line:none">‘<code
   3.635 -    class=css>none</code>’</dfn>
   3.636 -
   3.637 -   <dd>Neither produces nor inhibits text decoration.
   3.638 -
   3.639 -   <dt><dfn id=underline>‘<code class=css>underline</code>’</dfn>
   3.640 -
   3.641 -   <dd>Each line of text is underlined.
   3.642 -
   3.643 -   <dt><dfn id=overline>‘<code class=css>overline</code>’</dfn>
   3.644 -
   3.645 -   <dd>Each line of text has a line above it (i.e. on the opposite side from
   3.646 -    an underline).
   3.647 -
   3.648 -   <dt><dfn id=line-through>‘<code class=css>line-through</code>’</dfn>
   3.649 -
   3.650 -   <dd>Each line of text has a line through the middle.
   3.651 -  </dl>
   3.652 -
   3.653 -  <h4 id=text-decoration-color><span class=secno>10.1.2. </span> Text
   3.654 -   Decoration Color: the ‘<a href="#text-decoration-color0"><code
   3.655 -   class=property>text-decoration-color</code></a>’ property</h4>
   3.656 -
   3.657 -  <table class=propdef>
   3.658 -   <tbody>
   3.659 -    <tr>
   3.660 -     <th>Name:
   3.661 -
   3.662 -     <td><dfn id=text-decoration-color0>text-decoration-color</dfn>
   3.663 -
   3.664 -    <tr>
   3.665 -     <th><a href="#values">Value</a>:
   3.666 -
   3.667 -     <td><a href="http://www.w3.org/TR/css3-color/#color0"><span
   3.668 -      class=value-inst-color>&lt;color&gt;</span></a>
   3.669 -
   3.670 -    <tr>
   3.671 -     <th>Initial:
   3.672 -
   3.673 -     <td><a
   3.674 -      href="http://www.w3.org/TR/css3-color/#currentcolor">currentColor</a>
   3.675 -
   3.676 -    <tr>
   3.677 -     <th>Applies to:
   3.678 -
   3.679 -     <td>all elements
   3.680 -
   3.681 -    <tr>
   3.682 -     <th>Inherited:
   3.683 -
   3.684 -     <td>no
   3.685 -
   3.686 -    <tr>
   3.687 -     <th>Percentages:
   3.688 -
   3.689 -     <td>N/A
   3.690 -
   3.691 -    <tr>
   3.692 -     <th>Media:
   3.693 -
   3.694 -     <td>visual
   3.695 -
   3.696 -    <tr>
   3.697 -     <th>Computed value:
   3.698 -
   3.699 -     <td>the computed color
   3.700 -  </table>
   3.701 -
   3.702 -  <p>This property specifies the color of text decoration (underlines
   3.703 -   overlines, and line-throughs) set on the element with ‘<a
   3.704 -   href="#text-decoration-line0"><code
   3.705 -   class=property>text-decoration-line</code></a>’.
   3.706 -
   3.707 -  <h4 id=text-decoration-style><span class=secno>10.1.3. </span> Text
   3.708 -   Decoration Style: the ‘<a href="#text-decoration-style0"><code
   3.709 -   class=property>text-decoration-style</code></a>’ property</h4>
   3.710 -
   3.711 -  <table class=propdef>
   3.712 -   <tbody>
   3.713 -    <tr>
   3.714 -     <th>Name:
   3.715 -
   3.716 -     <td><dfn id=text-decoration-style0>text-decoration-style</dfn>
   3.717 -
   3.718 -    <tr>
   3.719 -     <th><a href="#values">Value</a>:
   3.720 -
   3.721 -     <td>solid | double | dotted | dashed | wavy
   3.722 -
   3.723 -    <tr>
   3.724 -     <th>Initial:
   3.725 -
   3.726 -     <td>solid
   3.727 -
   3.728 -    <tr>
   3.729 -     <th>Applies to:
   3.730 -
   3.731 -     <td>all elements
   3.732 -
   3.733 -    <tr>
   3.734 -     <th>Inherited:
   3.735 -
   3.736 -     <td>no
   3.737 -
   3.738 -    <tr>
   3.739 -     <th>Percentages:
   3.740 -
   3.741 -     <td>N/A
   3.742 -
   3.743 -    <tr>
   3.744 -     <th>Media:
   3.745 -
   3.746 -     <td>visual
   3.747 -
   3.748 -    <tr>
   3.749 -     <th>Computed value:
   3.750 -
   3.751 -     <td>as specified
   3.752 -  </table>
   3.753 -
   3.754 -  <p>This property specifies the style of the line(s) drawn for text
   3.755 -   decoration specified on the element. Values have the same meaning as for
   3.756 -   the <a
   3.757 -   href="http://www.w3.org/TR/css3-background/#the-border-style">border-style
   3.758 -   properties</a> <a href="#CSS3BG"
   3.759 -   rel=biblioentry>[CSS3BG]<!--{{!CSS3BG}}--></a>. ‘<code
   3.760 -   class=css>wavy</code>’ indicates a wavy line.
   3.761 -
   3.762 -  <h4 id=text-decoration><span class=secno>10.1.4. </span> Text Decoration
   3.763 -   Shorthand: the ‘<a href="#text-decoration0"><code
   3.764 -   class=property>text-decoration</code></a>’ property</h4>
   3.765 -
   3.766 -  <table class=propdef>
   3.767 -   <tbody>
   3.768 -    <tr>
   3.769 -     <th>Name:
   3.770 -
   3.771 -     <td><dfn id=text-decoration0>text-decoration</dfn>
   3.772 -
   3.773 -    <tr>
   3.774 -     <th><a href="#values">Value</a>:
   3.775 -
   3.776 -     <td><var><a
   3.777 -      href="#text-decoration-line">&lt;text-decoration-line&gt;</a></var> ||
   3.778 -      <var><a
   3.779 -      href="#text-decoration-style">&lt;text-decoration-style&gt;</a></var>
   3.780 -      || <var><a
   3.781 -      href="#text-decoration-color">&lt;text-decoration-color&gt;</a></var>
   3.782 -      || blink
   3.783 -
   3.784 -    <tr>
   3.785 -     <th>Initial:
   3.786 -
   3.787 -     <td>none
   3.788 -
   3.789 -    <tr>
   3.790 -     <th>Applies to:
   3.791 -
   3.792 -     <td>all elements
   3.793 -
   3.794 -    <tr>
   3.795 -     <th>Inherited:
   3.796 -
   3.797 -     <td>no
   3.798 -
   3.799 -    <tr>
   3.800 -     <th>Percentages:
   3.801 -
   3.802 -     <td>N/A
   3.803 -
   3.804 -    <tr>
   3.805 -     <th>Media:
   3.806 -
   3.807 -     <td>visual
   3.808 -
   3.809 -    <tr>
   3.810 -     <th>Computed value:
   3.811 -
   3.812 -     <td>as specified
   3.813 -  </table>
   3.814 -
   3.815 -  <p>This property is a shorthand for setting ‘<a
   3.816 -   href="#text-decoration-line0"><code
   3.817 -   class=property>text-decoration-line</code></a>’, ‘<a
   3.818 -   href="#text-decoration-color0"><code
   3.819 -   class=property>text-decoration-color</code></a>’, and ‘<a
   3.820 -   href="#text-decoration-style0"><code
   3.821 -   class=property>text-decoration-style</code></a>’ in one declaration.
   3.822 -   Omitted values are set to their initial values. A ‘<a
   3.823 -   href="#text-decoration0"><code
   3.824 -   class=property>text-decoration</code></a>’ declaration that omits both
   3.825 -   the ‘<a href="#text-decoration-color0"><code
   3.826 -   class=property>text-decoration-color</code></a>’ and ‘<a
   3.827 -   href="#text-decoration-style0"><code
   3.828 -   class=property>text-decoration-style</code></a>’ values is
   3.829 -   backwards-compatible with CSS Levels 1 and 2.
   3.830 -
   3.831 -  <p>If the ‘<code class=css>blink</code>’ keyword is specified the text
   3.832 -   blinks (alternates between visible and invisible). Conforming user agents
   3.833 -   may simply not blink the text. Note that not blinking the text is one
   3.834 -   technique to satisfy <a
   3.835 -   href="http://www.w3.org/TR/UAAG/guidelines.html#tech-on-off-blinking-text">checkpoint
   3.836 -   3.3 of WAI-UAAG</a>.
   3.837 -
   3.838 -  <div class=example>
   3.839 -   <p>The following example underlines unvisited links with a solid blue
   3.840 -    underline in CSS1 and CSS2 UAs and a navy dotted underline in CSS3 UAs.</p>
   3.841 -
   3.842 -   <pre><code class=css>
   3.843 -<!--   -->:link {
   3.844 -<!--   -->    color: blue;
   3.845 -<!--   -->    text-decoration: underline;
   3.846 -<!--   -->    text-decoration: navy dotted underline; /* <a
   3.847 -    href="http://www.w3.org/TR/CSS21/syndata.html#ignore">Ignored</a> in CSS1/CSS2 UAs */
   3.848 -<!--   -->}
   3.849 -<!-- --></code></pre>
   3.850 -  </div>
   3.851 -
   3.852 -  <h4 id=text-decoration-skip><span class=secno>10.1.5. </span> Text
   3.853 -   Decoration Line Continuity: the ‘<a href="#text-decoration-skip0"><code
   3.854 -   class=property>text-decoration-skip</code></a>’ property</h4>
   3.855 -
   3.856 -  <table class=propdef>
   3.857 -   <tbody>
   3.858 -    <tr>
   3.859 -     <th>Name:
   3.860 -
   3.861 -     <td><dfn id=text-decoration-skip0>text-decoration-skip</dfn>
   3.862 -
   3.863 -    <tr>
   3.864 -     <th><a href="#values">Value</a>:
   3.865 -
   3.866 -     <td>none | [ objects || spaces || ink || edges ]
   3.867 -
   3.868 -    <tr>
   3.869 -     <th>Initial:
   3.870 -
   3.871 -     <td>objects
   3.872 -
   3.873 -    <tr>
   3.874 -     <th>Applies to:
   3.875 -
   3.876 -     <td>all elements
   3.877 -
   3.878 -    <tr>
   3.879 -     <th>Inherited:
   3.880 -
   3.881 -     <td>yes
   3.882 -
   3.883 -    <tr>
   3.884 -     <th>Percentages:
   3.885 -
   3.886 -     <td>N/A
   3.887 -
   3.888 -    <tr>
   3.889 -     <th>Media:
   3.890 -
   3.891 -     <td>visual
   3.892 -
   3.893 -    <tr>
   3.894 -     <th>Computed value:
   3.895 -
   3.896 -     <td>as specified
   3.897 -  </table>
   3.898 -
   3.899 -  <p>This property specifies what parts of the element's content any text
   3.900 -   decoration affecting the element must skip over. It controls all text
   3.901 -   decoration lines drawn by the element and also any text decoration lines
   3.902 -   drawn by its ancestors. Values have the following meanings:
   3.903 -
   3.904 -  <dl>
   3.905 -   <dt><dfn id=none4 title="text-decoration-skip:none">‘<code
   3.906 -    class=css>none</code>’</dfn>
   3.907 -
   3.908 -   <dd>Skip nothing: text-decoration is drawn for all text content and for
   3.909 -    inline replaced elements.
   3.910 -
   3.911 -   <dt><dfn id=objects title="text-decoration-skip:objects">‘<code
   3.912 -    class=css>objects</code>’</dfn>
   3.913 -
   3.914 -   <dd>Skip this element if it is an atomic inline (such as an image or
   3.915 -    inline-block).
   3.916 -
   3.917 -   <dt><dfn id=spaces0 title="text-decoration-skip:spaces">‘<code
   3.918 -    class=css>spaces</code>’</dfn>
   3.919 -
   3.920 -   <dd>Skip white space: this includes regular spaces (U+0020) and tabs
   3.921 -    (U+0009), as well as nbsp (U+00A0), ideographic space (U+3000), all fixed
   3.922 -    width spaces (such as U+2000–U+200A, U+202F and U+205F), and any
   3.923 -    adjacent letter-spacing or word-spacing.
   3.924 -
   3.925 -   <dt><dfn id=ink title="text-decoration-skip:ink">‘<code
   3.926 -    class=css>ink</code>’</dfn>
   3.927 -
   3.928 -   <dd>Skip over where glyphs are drawn: interrupt the decoration line to let
   3.929 -    text show through where the text decoration would otherwise cross over a
   3.930 -    glyph. The UA may also skip a small distance to either side of the glyph
   3.931 -    outline.
   3.932 -
   3.933 -   <dt><dfn id=edges title="text-decoration-skip:edges">‘<code
   3.934 -    class=css>edges</code>’</dfn>
   3.935 -
   3.936 -   <dd>The UA should place the start and end of the line inwards from the
   3.937 -    content edge of the decorating element so that, e.g. two underlined
   3.938 -    elements side-by-side do not appear to have a single underline. (This is
   3.939 -    important in Chinese, where underlining is a form of punctuation.)
   3.940 -  </dl>
   3.941 -
   3.942 -  <p class=issue>Do we need a value that <em>doesn't</em> skip margins and
   3.943 -   padding?
   3.944 -
   3.945 -  <p class=note>Note that this property inherits and that descendant elements
   3.946 -   can have a different setting.
   3.947 -
   3.948 -  <h4 id=text-underline-position><span class=secno>10.1.6. </span> Text
   3.949 -   Underline Position: the ‘<a href="#text-underline-position0"><code
   3.950 -   class=property>text-underline-position</code></a>’ property</h4>
   3.951 -
   3.952 -  <table class=propdef>
   3.953 -   <tbody>
   3.954 -    <tr>
   3.955 -     <th>Name:
   3.956 -
   3.957 -     <td><dfn id=text-underline-position0>text-underline-position</dfn>
   3.958 -
   3.959 -    <tr>
   3.960 -     <th><a href="#values">Value</a>:
   3.961 -
   3.962 -     <td>auto | alphabetic | [ below || [ left | right ] ]
   3.963 -
   3.964 -    <tr>
   3.965 -     <th>Initial:
   3.966 -
   3.967 -     <td>auto
   3.968 -
   3.969 -    <tr>
   3.970 -     <th>Applies to:
   3.971 -
   3.972 -     <td>all elements
   3.973 -
   3.974 -    <tr>
   3.975 -     <th>Inherited:
   3.976 -
   3.977 -     <td>yes
   3.978 -
   3.979 -    <tr>
   3.980 -     <th>Percentages:
   3.981 -
   3.982 -     <td>N/A
   3.983 -
   3.984 -    <tr>
   3.985 -     <th>Media:
   3.986 -
   3.987 -     <td>visual
   3.988 -
   3.989 -    <tr>
   3.990 -     <th>Computed value:
   3.991 -
   3.992 -     <td>as specified
   3.993 -  </table>
   3.994 -
   3.995 -  <p>This property sets the position of an underline specified on the same
   3.996 -   element: it does not affect underlines specified by ancestor elements.
   3.997 -   Values have the following meanings:
   3.998 -
   3.999 -  <dl>
  3.1000 -   <dt><dfn id=auto3>‘<code class=css>auto</code>’</dfn>
  3.1001 -
  3.1002 -   <dd>The user agent may use any algorithm to determine the underline's
  3.1003 -    position; however it must be placed at or below the alphabetic baseline.
  3.1004 -    <p class=note>It is suggested that the underline position be ‘<a
  3.1005 -     href="#alphabetic"><code class=css>alphabetic</code></a>’ unless it
  3.1006 -     crosses either subscripted (or otherwise lowered) text, or it affects
  3.1007 -     characters from Asian scripts such as Han or Tibetan, for which an
  3.1008 -     alphabetic underline is too high: in such cases, aligning to the em box
  3.1009 -     edge as described for ‘<code class=css>below left</code>’ is more
  3.1010 -     appropriate.
  3.1011 -
  3.1012 -   <dt><dfn id=alphabetic>‘<code class=css>alphabetic</code>’</dfn>
  3.1013 -
  3.1014 -   <dd>The underline is positioned relative to the alphabetic baseline. In
  3.1015 -    this case the underline is likely to cross some descenders.
  3.1016 -    <div class=figure>
  3.1017 -     <p><img
  3.1018 -      alt="In a typical Latin font, the underline is positioned slightly                      below the alphabetic baseline, leaving a gap between the line                      and the bottom of most Latin letters, but crossing through                      descenders such as the stem of a 'p'."
  3.1019 -      src=underline-position-alphabetic.png
  3.1020 -      title="text-underline-position: alphabetic">
  3.1021 -
  3.1022 -     <p class=caption>‘<code class=css>text-underline-position:
  3.1023 -      alphabetic</code>’</p>
  3.1024 -    </div>
  3.1025 -
  3.1026 -   <dt><dfn id=below>‘<code class=css>below</code>’</dfn>
  3.1027 -
  3.1028 -   <dd>In horizontal writing modes, the underline is positioned relative to
  3.1029 -    the under edge of the element's content box. In this case the underline
  3.1030 -    usually does not cross the descenders. (This is sometimes called
  3.1031 -    "accounting" underline.) If the underline affects descendants with a
  3.1032 -    lower content edge, the user agent should shift the underline down
  3.1033 -    further to the lowest underlined content box edge. The user agent may
  3.1034 -    ignore elements with ‘<code class=css>vertical-align</code>’ values
  3.1035 -    given as lengths, percentages, ‘<code class=css>top</code>’, or
  3.1036 -    ‘<code class=css>bottom</code>’ when making this adjustment. (Note
  3.1037 -    that images that are not affected by the underline per ‘<a
  3.1038 -    href="#text-decoration-skip0"><code
  3.1039 -    class=property>text-decoration-skip</code></a>’ will not affect the
  3.1040 -    position of the underline.)
  3.1041 -    <div class=figure>
  3.1042 -     <p><img
  3.1043 -      alt="In a typical Latin font, the underline is far enough                      below the text that it does not cross the bottom of a 'g'."
  3.1044 -      src=underline-position-below.png
  3.1045 -      title="text-underline-position: below">
  3.1046 -
  3.1047 -     <p class=caption>‘<code class=css>text-underline-position:
  3.1048 -      below</code>’</p>
  3.1049 -    </div>
  3.1050 -
  3.1051 -    <div class=example>
  3.1052 -     <p>Because ‘<a href="#text-underline-position0"><code
  3.1053 -      class=property>text-underline-position</code></a>’ inherits, and is
  3.1054 -      not reset by the ‘<a href="#text-decoration0"><code
  3.1055 -      class=property>text-decoration</code></a>’ shorthand, the following
  3.1056 -      example switches the document to use ‘<a href="#below"><code
  3.1057 -      class=css>below</code></a>’ underlining, which can be more
  3.1058 -      appropriate for writing systems with long, complicated descenders. It
  3.1059 -      is also often useful for mathematical or chemical texts that use many
  3.1060 -      subscripts.
  3.1061 -
  3.1062 -     <pre>:root { text-underline-position: below; }</pre>
  3.1063 -    </div>
  3.1064 -
  3.1065 -   <dt><dfn id=left0>‘<code class=css>left</code>’</dfn>
  3.1066 -
  3.1067 -   <dd>In vertical writing modes, the underline is aligned as for ‘<a
  3.1068 -    href="#below"><code class=css>below</code></a>’, on the left edge of
  3.1069 -    the text.
  3.1070 -
  3.1071 -   <dt><dfn id=right0>‘<code class=css>right</code>’</dfn>
  3.1072 -
  3.1073 -   <dd>In vertical writing modes, the underline is aligned as for ‘<a
  3.1074 -    href="#below"><code class=css>below</code></a>’, except it is aligned
  3.1075 -    to the right edge of the text. If this causes the underline to be drawn
  3.1076 -    on the "over" side of the text, then an overline also switches sides and
  3.1077 -    is drawn on the "under" side.
  3.1078 -  </dl>
  3.1079 -
  3.1080 -  <p>If ‘<a href="#below"><code class=css>below</code></a>’ is specified
  3.1081 -   alone, ‘<a href="#left0"><code class=css>left</code></a>’ is also
  3.1082 -   implied. If ‘<a href="#left0"><code class=css>left</code></a>’ or
  3.1083 -   ‘<a href="#right0"><code class=css>right</code></a>’ is specified
  3.1084 -   alone, ‘<a href="#below"><code class=css>below</code></a>’ is also
  3.1085 -   implied.
  3.1086 -
  3.1087 -  <p class=issue> Should ‘<code class=css>above</code>’/‘<a
  3.1088 -   href="#below"><code class=css>below</code></a>’ be ‘<code
  3.1089 -   class=css>over</code>’/‘<code class=css>under</code>’ to match text
  3.1090 -   decoration names?
  3.1091 -
  3.1092 -  <div class=figure id=fig-text-underline-position>
  3.1093 -   <table>
  3.1094 -    <tbody>
  3.1095 -     <tr>
  3.1096 -      <td> <img
  3.1097 -       alt="In mixed Japanese-Latin vertical text, 'text-underline-position: left'                         places the underline on the left side of the text."
  3.1098 -       src=underline-position-left.png title="text-underline-position: left">
  3.1099 -       
  3.1100 -
  3.1101 -      <td> <img
  3.1102 -       alt="In mixed Japanese-Latin vertical text, 'text-underline-position: right'                         places the underline on the right side of the text."
  3.1103 -       src=underline-position-right.png
  3.1104 -       title="text-underline-position: right">
  3.1105 -
  3.1106 -     <tr>
  3.1107 -      <td>‘<a href="#left0"><code class=css>left</code></a>’
  3.1108 -
  3.1109 -      <td>‘<a href="#right0"><code class=css>right</code></a>’
  3.1110 -   </table>
  3.1111 -
  3.1112 -   <p class=caption>In vertical writing modes, the ‘<a
  3.1113 -    href="#text-underline-position0"><code
  3.1114 -    class=property>text-underline-position</code></a>’ values ‘<a
  3.1115 -    href="#left0"><code class=css>left</code></a>’ and ‘<a
  3.1116 -    href="#right0"><code class=css>right</code></a>’ allow placing the
  3.1117 -    underline on either side of the text. (In horizontal writing modes, both
  3.1118 -    values are treated as ‘<a href="#below"><code
  3.1119 -    class=css>below</code></a>’.)</p>
  3.1120 -  </div>
  3.1121 -
  3.1122 -  <div class=example>
  3.1123 -   <p>The following example styles modern Chinese, Japanese, and Korean texts
  3.1124 -    with the appropriate underline positions in both horizontal and vertical
  3.1125 -    text:
  3.1126 -
  3.1127 -   <pre>:root:lang(ja), [lang|=ja], :root:lang(ko), [lang|=ko] { text-underline-position: below right; }
  3.1128 -<!--   -->:root:lang(zh), [lang|=zh] { text-underline-position: below left; }</pre>
  3.1129 -  </div>
  3.1130 -
  3.1131 -  <div class=note>
  3.1132 -   <p>In some cases (such as in OpenType) the font format can offer
  3.1133 -    information about the appropriate position of an underline. Typically
  3.1134 -    this information gives the position of an ‘<a href="#alphabetic"><code
  3.1135 -    class=css>alphabetic</code></a>’ underline; in some cases (especially
  3.1136 -    in CJK fonts), it gives the position of a ‘<code class=css>below
  3.1137 -    left</code>’ underline. (In this case, the font's underline metrics
  3.1138 -    typically touch the bottom edge of the em box). The UA is encouraged to
  3.1139 -    use information (such as the underline thickness, or appropriate
  3.1140 -    alphabetic alignment) from the font wherever appropriate.</p>
  3.1141 -  </div>
  3.1142 -
  3.1143 -  <h3 id=emphasis-marks><span class=secno>10.2. </span> Emphasis Marks</h3>
  3.1144 -
  3.1145 -  <p>East Asian documents traditionally use small symbols next to each glyph
  3.1146 -   to emphasize a run of text. For example:
  3.1147 -
  3.1148 -  <div class=figure>
  3.1149 -   <p> <img alt="Example of emphasis in Japanese appearing above the text"
  3.1150 -    class=example height=28 src=text-emphasis-ja.gif width=225></p>
  3.1151 -
  3.1152 -   <p class=caption>Accent emphasis (shown in blue for clarity) applied to
  3.1153 -    Japanese text</p>
  3.1154 -  </div>
  3.1155 -
  3.1156 -  <h4 id=text-emphasis-style><span class=secno>10.2.1. </span> Emphasis Mark
  3.1157 -   Style: the ‘<a href="#text-emphasis-style0"><code
  3.1158 -   class=property>text-emphasis-style</code></a>’ property</h4>
  3.1159 -
  3.1160 -  <table class=propdef>
  3.1161 -   <tbody>
  3.1162 -    <tr>
  3.1163 -     <th>Name:
  3.1164 -
  3.1165 -     <td><dfn id=text-emphasis-style0>text-emphasis-style</dfn>
  3.1166 -
  3.1167 -    <tr>
  3.1168 -     <th><a href="#values">Value</a>:
  3.1169 -
  3.1170 -     <td>none | [ [ filled | open ] || [ dot | circle | double-circle |
  3.1171 -      triangle | sesame ] ] | <a class=noxref
  3.1172 -      href="http://www.w3.org/TR/CSS21/syndata.html#value-def-string"><span
  3.1173 -      class=value-inst-string>&lt;string&gt;</span></a>
  3.1174 -
  3.1175 -    <tr>
  3.1176 -     <th>Initial:
  3.1177 -
  3.1178 -     <td>none
  3.1179 -
  3.1180 -    <tr>
  3.1181 -     <th>Applies to:
  3.1182 -
  3.1183 -     <td>all elements
  3.1184 -
  3.1185 -    <tr>
  3.1186 -     <th>Inherited:
  3.1187 -
  3.1188 -     <td>yes
  3.1189 -
  3.1190 -    <tr>
  3.1191 -     <th>Percentages:
  3.1192 -
  3.1193 -     <td>N/A
  3.1194 -
  3.1195 -    <tr>
  3.1196 -     <th>Media:
  3.1197 -
  3.1198 -     <td>visual
  3.1199 -
  3.1200 -    <tr>
  3.1201 -     <th>Computed value:
  3.1202 -
  3.1203 -     <td>‘<code class=property>none</code>’, a pair of keywords
  3.1204 -      representing the shape and fill, or a string
  3.1205 -  </table>
  3.1206 -
  3.1207 -  <p>This property applies emphasis marks to the element's text. Values have
  3.1208 -   the following meanings:
  3.1209 -
  3.1210 -  <dl>
  3.1211 -   <dt><dfn id=none5 title="text-emphasis:none">‘<code
  3.1212 -    class=css>none</code>’</dfn>
  3.1213 -
  3.1214 -   <dd>No emphasis marks.
  3.1215 -
  3.1216 -   <dt><dfn id=filled title="text-emphasis:filled">‘<code
  3.1217 -    class=css>filled</code>’</dfn>
  3.1218 -
  3.1219 -   <dd>The shape is filled with solid color.
  3.1220 -
  3.1221 -   <dt><dfn id=open title="text-emphasis:open">‘<code
  3.1222 -    class=css>open</code>’</dfn>
  3.1223 -
  3.1224 -   <dd>The shape is hollow.
  3.1225 -
  3.1226 -   <dt><dfn id=dot title="text-emphasis:dot">‘<code
  3.1227 -    class=css>dot</code>’</dfn>
  3.1228 -
  3.1229 -   <dd>Display small circles as marks. The filled dot is U+2022 ‘<code
  3.1230 -    class=css>•</code>’, and the open dot is U+25E6 ‘<code
  3.1231 -    class=css>◦</code>’.
  3.1232 -
  3.1233 -   <dt><dfn id=circle title="text-emphasis:circle">‘<code
  3.1234 -    class=css>circle</code>’</dfn>
  3.1235 -
  3.1236 -   <dd>Display large circles as marks. The filled circle is U+25CF ‘<code
  3.1237 -    class=css>●</code>’, and the open circle is U+25CB ‘<code
  3.1238 -    class=css>○</code>’.
  3.1239 -
  3.1240 -   <dt><dfn id=double-circle title="text-emphasis:double-circle">‘<code
  3.1241 -    class=css>double-circle</code>’</dfn>
  3.1242 -
  3.1243 -   <dd>Display double circles as marks. The filled double-circle is U+25C9
  3.1244 -    ‘<code class=css>◉</code>’, and the open double-circle is U+25CE
  3.1245 -    ‘<code class=css>◎</code>’.
  3.1246 -
  3.1247 -   <dt><dfn id=triangle title="text-emphasis:triangle">‘<code
  3.1248 -    class=css>triangle</code>’</dfn>
  3.1249 -
  3.1250 -   <dd>Display triangles as marks. The filled triangle is U+25B2 ‘<code
  3.1251 -    class=css>▲</code>’, and the open triangle is U+25B3 ‘<code
  3.1252 -    class=css>△</code>’.
  3.1253 -
  3.1254 -   <dt><dfn id=sesame title="text-emphasis:sesame">‘<code
  3.1255 -    class=css>sesame</code>’</dfn>
  3.1256 -
  3.1257 -   <dd>Display sesames as marks. The filled sesame is U+FE45 ‘<code
  3.1258 -    class=css>﹅</code>’, and the open sesame is U+FE46 ‘<code
  3.1259 -    class=css>﹆</code>’.
  3.1260 -
  3.1261 -   <dt><dfn id=ltstringgt0 title="text-emphasis:sesame">‘<code
  3.1262 -    class=css><var>&lt;string&gt;</var></code>’</dfn>
  3.1263 -
  3.1264 -   <dd>Display the given string as marks. Authors should not specify more
  3.1265 -    than one <a href="#character"><i>character</i></a> in &lt;string&gt;. The
  3.1266 -    UA may truncate or ignore strings consisting of more than one grapheme
  3.1267 -    cluster.
  3.1268 -  </dl>
  3.1269 -
  3.1270 -  <p>If a shape keyword is specified but neither of ‘<code
  3.1271 -   class=css>filled</code>’ nor ‘<code class=css>open</code>’ is
  3.1272 -   specified, ‘<code class=css>filled</code>’ is assumed. If only
  3.1273 -   ‘<code class=css>filled</code>’ or ‘<code class=css>open</code>’
  3.1274 -   is specified, the shape keyword computes to ‘<code
  3.1275 -   class=css>circle</code>’ in horizontal writing mode and ‘<code
  3.1276 -   class=css>sesame</code>’ in vertical writing mode.
  3.1277 -
  3.1278 -  <p>The marks should be drawn using the element's font settings with its
  3.1279 -   size scaled down to 50%. However, not all fonts have all these glyphs, and
  3.1280 -   some fonts use inappropriate sizes for emphasis marks in these code
  3.1281 -   points. The UA may opt to use a font known to be good for emphasis marks,
  3.1282 -   or the marks may instead be synthesized by the UA. Marks must remain
  3.1283 -   upright in vertical writing modes: like CJK characters, they do not rotate
  3.1284 -   to match the writing mode.
  3.1285 -
  3.1286 -  <p class=note> One example of good fonts for emphasis marks is Adobe's
  3.1287 -   opensource project, <a
  3.1288 -   href="http://sourceforge.net/adobe/kenten-generic/">Kenten Generic
  3.1289 -   OpenType Font</a>, which is specially designed for the emphasis marks.
  3.1290 -
  3.1291 -  <p>The marks are drawn once for each <a
  3.1292 -   href="#character"><i>character</i></a>. However, emphasis marks are not
  3.1293 -   drawn for characters that are:
  3.1294 -
  3.1295 -  <ul>
  3.1296 -   <li><a href="#word-separator">Word separators</a> or that belong to the
  3.1297 -    Unicode separator classes (Z*). (But note that emphasis marks
  3.1298 -    <em>are</em> drawn for a space that combines with any combining
  3.1299 -    characters.)
  3.1300 -
  3.1301 -   <li>Characters belonging to the Unicode classes for control codes and
  3.1302 -    unassigned characters (Cc, Cf, Cn).
  3.1303 -  </ul>
  3.1304 -
  3.1305 -  <p>If emphasis marks are drawn for characters for which ruby is drawn in
  3.1306 -   the same position as the emphasis mark, the ruby should be stacked between
  3.1307 -   the emphasis marks and the base text. In this case, the position of the
  3.1308 -   emphasis marks for a given element should be determined as if all
  3.1309 -   characters have ruby boxes of the same height as the highest ruby box in
  3.1310 -   the element. If the UA is not capable of drawing ruby and emphasis marks
  3.1311 -   on the same side, the UA may hide ruby and draw only emphasis marks.
  3.1312 -
  3.1313 -  <div class=figure>
  3.1314 -   <p><img
  3.1315 -    alt="Example of emphasis marks applied to 4 characters, and ruby to 2 of them"
  3.1316 -    height=50 src=text-emphasis-ruby.png width=134></p>
  3.1317 -
  3.1318 -   <p class=caption>Emphasis marks applied to 4 characters, and ruby to 2 of
  3.1319 -    them</p>
  3.1320 -  </div>
  3.1321 -
  3.1322 -  <p class=note>A future level of CSS may define controls to specify what to
  3.1323 -   do when emphasis marks and ruby text coincide.
  3.1324 -
  3.1325 -  <h4 id=text-emphasis-color><span class=secno>10.2.2. </span> Emphasis Mark
  3.1326 -   Color: the ‘<a href="#text-emphasis-color0"><code
  3.1327 -   class=property>text-emphasis-color</code></a>’ property</h4>
  3.1328 -
  3.1329 -  <table class=propdef>
  3.1330 -   <tbody>
  3.1331 -    <tr>
  3.1332 -     <th>Name:
  3.1333 -
  3.1334 -     <td><dfn id=text-emphasis-color0>text-emphasis-color</dfn>
  3.1335 -
  3.1336 -    <tr>
  3.1337 -     <th><a href="#values">Value</a>:
  3.1338 -
  3.1339 -     <td>&lt;color&gt;
  3.1340 -
  3.1341 -    <tr>
  3.1342 -     <th>Initial:
  3.1343 -
  3.1344 -     <td><a
  3.1345 -      href="http://www.w3.org/TR/css3-color/#currentcolor">currentColor</a>
  3.1346 -
  3.1347 -    <tr>
  3.1348 -     <th>Applies to:
  3.1349 -
  3.1350 -     <td>all elements
  3.1351 -
  3.1352 -    <tr>
  3.1353 -     <th>Inherited:
  3.1354 -
  3.1355 -     <td>yes
  3.1356 -
  3.1357 -    <tr>
  3.1358 -     <th>Percentages:
  3.1359 -
  3.1360 -     <td>N/A
  3.1361 -
  3.1362 -    <tr>
  3.1363 -     <th>Media:
  3.1364 -
  3.1365 -     <td>visual
  3.1366 -
  3.1367 -    <tr>
  3.1368 -     <th>Computed value:
  3.1369 -
  3.1370 -     <td>as specified
  3.1371 -  </table>
  3.1372 -
  3.1373 -  <p>This property specifies the foreground color of the emphasis marks.
  3.1374 -
  3.1375 -  <p class=note> The correct behavior of this property depends on an
  3.1376 -   outstanding erratum on <a href="#CSS3COLOR"
  3.1377 -   rel=biblioentry>[CSS3COLOR]<!--{{CSS3COLOR}}--></a> that has the ‘<a
  3.1378 -   href="#currentcolor"><code class=css>currentColor</code></a>’ keyword
  3.1379 -   inherit as itself, and to take the value of the ‘<code
  3.1380 -   class=property>color</code>’ property as its <em>used</em> (not
  3.1381 -   computed) value.
  3.1382 -
  3.1383 -  <h4 id=text-emphasis><span class=secno>10.2.3. </span> Emphasis Mark
  3.1384 -   Shorthand: the ‘<a href="#text-emphasis0"><code
  3.1385 -   class=property>text-emphasis</code></a>’ property</h4>
  3.1386 -
  3.1387 -  <table class=propdef>
  3.1388 -   <tbody>
  3.1389 -    <tr>
  3.1390 -     <th>Name:
  3.1391 -
  3.1392 -     <td><dfn id=text-emphasis0>text-emphasis</dfn>
  3.1393 -
  3.1394 -    <tr>
  3.1395 -     <th><a href="#values">Value</a>:
  3.1396 -
  3.1397 -     <td>‘<code class=css>&lt;<a
  3.1398 -      href="#text-emphasis-style">text-emphasis-style</a>&gt;</code>’ ||
  3.1399 -      ‘<code class=css>&lt;<a
  3.1400 -      href="#text-emphasis-color">text-emphasis-color</a>&gt;</code>’
  3.1401 -
  3.1402 -    <tr>
  3.1403 -     <th>Initial:
  3.1404 -
  3.1405 -     <td>see individual properties
  3.1406 -
  3.1407 -    <tr>
  3.1408 -     <th>Applies to:
  3.1409 -
  3.1410 -     <td>all elements
  3.1411 -
  3.1412 -    <tr>
  3.1413 -     <th>Inherited:
  3.1414 -
  3.1415 -     <td>yes
  3.1416 -
  3.1417 -    <tr>
  3.1418 -     <th>Percentages:
  3.1419 -
  3.1420 -     <td>N/A
  3.1421 -
  3.1422 -    <tr>
  3.1423 -     <th>Media:
  3.1424 -
  3.1425 -     <td>visual
  3.1426 -
  3.1427 -    <tr>
  3.1428 -     <th>Computed value:
  3.1429 -
  3.1430 -     <td>see individual properties
  3.1431 -  </table>
  3.1432 -
  3.1433 -  <p>This property is a shorthand for setting ‘<a
  3.1434 -   href="#text-emphasis-style0"><code
  3.1435 -   class=property>text-emphasis-style</code></a>’ and ‘<a
  3.1436 -   href="#text-emphasis-color0"><code
  3.1437 -   class=property>text-emphasis-color</code></a>’ in one declaration.
  3.1438 -   Omitted values are set to their initial values.
  3.1439 -
  3.1440 -  <p class=note>Note that ‘<a href="#text-emphasis-position0"><code
  3.1441 -   class=property>text-emphasis-position</code></a>’ is not reset in this
  3.1442 -   shorthand. This is because typically the shape and color vary, but the
  3.1443 -   position is consistent for a particular language throughout the document.
  3.1444 -   Therefore the position should inherit independently.
  3.1445 -
  3.1446 -  <h4 id=text-emphasis-position><span class=secno>10.2.4. </span> Emphasis
  3.1447 -   Mark Position: the ‘<a href="#text-emphasis-position0"><code
  3.1448 -   class=property>text-emphasis-position</code></a>’ property</h4>
  3.1449 -
  3.1450 -  <table class=propdef>
  3.1451 -   <tbody>
  3.1452 -    <tr>
  3.1453 -     <th>Name:
  3.1454 -
  3.1455 -     <td><dfn id=text-emphasis-position0>text-emphasis-position</dfn>
  3.1456 -
  3.1457 -    <tr>
  3.1458 -     <th><a href="#values">Value</a>:
  3.1459 -
  3.1460 -     <td>[ above | below ] && [ right | left ]
  3.1461 -
  3.1462 -    <tr>
  3.1463 -     <th>Initial:
  3.1464 -
  3.1465 -     <td>above right
  3.1466 -
  3.1467 -    <tr>
  3.1468 -     <th>Applies to:
  3.1469 -
  3.1470 -     <td>all elements
  3.1471 -
  3.1472 -    <tr>
  3.1473 -     <th>Inherited:
  3.1474 -
  3.1475 -     <td>yes
  3.1476 -
  3.1477 -    <tr>
  3.1478 -     <th>Percentages:
  3.1479 -
  3.1480 -     <td>N/A
  3.1481 -
  3.1482 -    <tr>
  3.1483 -     <th>Media:
  3.1484 -
  3.1485 -     <td>visual
  3.1486 -
  3.1487 -    <tr>
  3.1488 -     <th>Computed value:
  3.1489 -
  3.1490 -     <td>as specified
  3.1491 -  </table>
  3.1492 -
  3.1493 -  <p>This property describes where emphasis marks are drawn at. The values
  3.1494 -   have following meanings:
  3.1495 -
  3.1496 -  <dl>
  3.1497 -   <dt><dfn id=above title="text-emphasis:above">‘<code
  3.1498 -    class=css>above</code>’</dfn>
  3.1499 -
  3.1500 -   <dd>Draw marks over the text in horizontal writing mode.
  3.1501 -
  3.1502 -   <dt><dfn id=below0 title="text-emphasis:below">‘<code
  3.1503 -    class=css>below</code>’</dfn>
  3.1504 -
  3.1505 -   <dd>Draw marks under the text in horizontal writing mode.
  3.1506 -
  3.1507 -   <dt><dfn id=right1 title="text-emphasis:right">‘<code
  3.1508 -    class=css>right</code>’</dfn>
  3.1509 -
  3.1510 -   <dd>Draw marks to the right of the text in vertical writing mode.
  3.1511 -
  3.1512 -   <dt><dfn id=left1 title="text-emphasis:left">‘<code
  3.1513 -    class=css>left</code>’</dfn>
  3.1514 -
  3.1515 -   <dd>Draw marks to the left of the text in vertical writing mode.
  3.1516 -  </dl>
  3.1517 -
  3.1518 -  <p class=issue> Should ‘<code class=css>above</code>’/‘<a
  3.1519 -   href="#below"><code class=css>below</code></a>’ be ‘<code
  3.1520 -   class=css>over</code>’/‘<code class=css>under</code>’ to match text
  3.1521 -   decoration names?
  3.1522 -
  3.1523 -  <p>Emphasis marks are drawn exactly as if each character was assigned the
  3.1524 -   mark as its ruby annotation text with the ruby position given by ‘<a
  3.1525 -   href="#text-emphasis-position0"><code
  3.1526 -   class=property>text-emphasis-position</code></a>’ and the ruby alignment
  3.1527 -   as centered.
  3.1528 -
  3.1529 -  <p>The effect of emphasis marks on the line height is the same as for ruby
  3.1530 -   text.
  3.1531 -
  3.1532 -  <div class=note>
  3.1533 -   <p>Note, the preferred position of emphasis marks depends on the language.
  3.1534 -    In Japanese for example, the preferred position is ‘<code
  3.1535 -    class=css>above right</code>’. In Chinese, on the other hand, the
  3.1536 -    preferred position is ‘<code class=css>below right</code>’. The
  3.1537 -    informative table below summarizes the preferred emphasis mark positions
  3.1538 -    for Chinese and Japanese:</p>
  3.1539 -
  3.1540 -   <table class=data>
  3.1541 -    <caption>Preferred emphasis mark and ruby position</caption>
  3.1542 -
  3.1543 -    <thead>
  3.1544 -     <tr>
  3.1545 -      <th rowspan=2 scope=col>Language
  3.1546 -
  3.1547 -      <th colspan=2 scope=col>Preferred mark position
  3.1548 -
  3.1549 -      <th colspan=2 rowspan=2 scope=col>Illustration
  3.1550 -
  3.1551 -     <tr>
  3.1552 -      <th>Horizontal
  3.1553 -
  3.1554 -      <th>Vertical
  3.1555 -
  3.1556 -    <tbody>
  3.1557 -     <tr>
  3.1558 -      <td scope=row>Japanese
  3.1559 -
  3.1560 -      <td>above
  3.1561 -
  3.1562 -      <td>right
  3.1563 -
  3.1564 -      <td> <img
  3.1565 -       alt="Emphasis marks appear above each emphasized character in horizontal Japanese text."
  3.1566 -       height=28 src=text-emphasis-ja.gif
  3.1567 -       title="Emphasis (shown in blue for clarity) applied above a fragment of Japanese text"
  3.1568 -       width=225>
  3.1569 -
  3.1570 -      <td rowspan=2> <img
  3.1571 -       alt="Emphasis marks appear on the right of each emphasized character in vertical Japanese text."
  3.1572 -       height=89 src=text-emphasis-v.gif
  3.1573 -       title="Emphasis applied on the right of a fragment of Japanese text"
  3.1574 -       width=34>
  3.1575 -     </tr>
  3.1576 -     <!--
  3.1577 -          <tr>
  3.1578 -            <td scope="row">Mongolian</td>
  3.1579 -            <td><span class="issue">?</span></td>
  3.1580 -            <td>right</td>
  3.1581 -          </tr>
  3.1582 -          -->
  3.1583 -
  3.1584 -     <tr>
  3.1585 -      <td scope=row>Chinese
  3.1586 -
  3.1587 -      <td>below
  3.1588 -
  3.1589 -      <td>right
  3.1590 -
  3.1591 -      <td> <img
  3.1592 -       alt="Emphasis marks appear below each emphasized character in horizontal Simplified Chinese text."
  3.1593 -       height=28 src=text-emphasis-zh.gif
  3.1594 -       title="Emphasis (shown in blue for clarity) applied below a fragment of Chinese text"
  3.1595 -       width=133>
  3.1596 -   </table>
  3.1597 -  </div>
  3.1598 -
  3.1599 -  <h3 id=text-shadow><span class=secno>10.3. </span> Text Shadows: the ‘<a
  3.1600 -   href="#text-shadow0"><code class=property>text-shadow</code></a>’
  3.1601 -   property</h3>
  3.1602 -
  3.1603 -  <table class=propdef>
  3.1604 -   <tbody>
  3.1605 -    <tr>
  3.1606 -     <th>Name:
  3.1607 -
  3.1608 -     <td><dfn id=text-shadow0>text-shadow</dfn>
  3.1609 -
  3.1610 -    <tr>
  3.1611 -     <th><a href="#values">Value</a>:
  3.1612 -
  3.1613 -     <td>none | [ &lt;length>{2,3} && &lt;color>? ]#
  3.1614 -
  3.1615 -    <tr>
  3.1616 -     <th>Initial:
  3.1617 -
  3.1618 -     <td>none
  3.1619 -
  3.1620 -    <tr>
  3.1621 -     <th>Applies to:
  3.1622 -
  3.1623 -     <td>all elements
  3.1624 -
  3.1625 -    <tr>
  3.1626 -     <th>Inherited:
  3.1627 -
  3.1628 -     <td>yes
  3.1629 -
  3.1630 -    <tr>
  3.1631 -     <th>Percentages:
  3.1632 -
  3.1633 -     <td>N/A
  3.1634 -
  3.1635 -    <tr>
  3.1636 -     <th>Media:
  3.1637 -
  3.1638 -     <td>visual
  3.1639 -
  3.1640 -    <tr>
  3.1641 -     <th>Computed value:
  3.1642 -
  3.1643 -     <td>a color plus three absolute &lt;length&gt;s
  3.1644 -  </table>
  3.1645 -
  3.1646 -  <p>This property accepts a comma-separated list of shadow effects to be
  3.1647 -   applied to the text of the element. Values are interpreted as for <a
  3.1648 -   href="http://www.w3.org/TR/css3-background/#the-box-shadow">‘<code
  3.1649 -   class=property>box-shadow</code>’</a> <a href="#CSS3BG"
  3.1650 -   rel=biblioentry>[CSS3BG]<!--{{!CSS3BG}}--></a>. (But note that spread
  3.1651 -   values are not allowed.) The shadow is applied to all of the element's
  3.1652 -   text as well as any text decorations it specifies.
  3.1653 -
  3.1654 -  <p>The shadow effects are applied front-to-back: the first shadow is on
  3.1655 -   top. The shadows may thus overlay each other, but they never overlay the
  3.1656 -   text itself. The shadow must be painted at a stack level between the
  3.1657 -   element's border and/or background, if present, and the elements text and
  3.1658 -   text decoration. UAs should avoid painting text shadows over text in
  3.1659 -   adjacent elements belonging to the same stack level and stacking context.
  3.1660 -   (This may mean that the exact stack level of the shadows depends on
  3.1661 -   whether the element has a border or background: the exact stacking
  3.1662 -   behavior of text shadows is thus UA-defined.)
  3.1663 -
  3.1664 -  <p>Unlike ‘<code class=property>box-shadow</code>’, text shadows are
  3.1665 -   not clipped to the shadowed shape and may show through if the text is
  3.1666 -   partially-transparent. Like ‘<code class=property>box-shadow</code>’,
  3.1667 -   text shadows do not influence layout, and do not trigger scrolling or
  3.1668 -   increase the size of the scrollable area.
  3.1669 -
  3.1670 -  <p class=note>The painting order of shadows defined here is the opposite of
  3.1671 -   that defined in the 1998 <a
  3.1672 -   href="http://www.w3.org/TR/1998/REC-CSS2-19980512">CSS2
  3.1673 -   Recommendation</a>.
  3.1674 -
  3.1675 -  <p>The ‘<a href="#text-shadow0"><code class=css>text-shadow</code></a>’
  3.1676 -   property applies to both the <code>::first-line</code> and
  3.1677 -   <code>::first-letter</code> pseudo-elements.
  3.1678 +  <p class=note> <a name=line-decoration></a> <a
  3.1679 +   name=text-decoration-line></a> <a name=text-decoration-color></a> <a
  3.1680 +   name=text-decoration-style></a> <a name=text-decoration-skip></a> <a
  3.1681 +   name=text-underline-position></a> <a name=emphasis-marks></a> <a
  3.1682 +   name=text-emphasis-style></a> <a name=text-emphasis-color></a> <a
  3.1683 +   name=text-emphasis></a> <a name=text-emphasis-position></a> <a
  3.1684 +   name=text-shadow></a> Text decoration has moved to <a
  3.1685 +   href="http://www.w3.org/TR/css3-text-decor/">CSS Text Decoration Module
  3.1686 +   Level 3</a>. [[CSS3TXTDECOR]]
  3.1687  
  3.1688    <h2 id=conformance><span class=secno>11. </span> Conformance</h2>
  3.1689  
  3.1690 @@ -4421,7 +3170,7 @@
  3.1691     <code>class="example"</code>, like this:
  3.1692  
  3.1693    <div class=example>
  3.1694 -   <p>This is an example of an informative example.</p>
  3.1695 +   <p>This is an example of an informative example.
  3.1696    </div>
  3.1697  
  3.1698    <p>Informative notes begin with the word “Note” and are set apart from
  3.1699 @@ -4600,7 +3349,7 @@
  3.1700      Sheets Level 2 Revision 1 (CSS 2.1) Specification.</cite></a> 7 June
  3.1701      2011. W3C Recommendation. URL: <a
  3.1702      href="http://www.w3.org/TR/2011/REC-CSS2-20110607">http://www.w3.org/TR/2011/REC-CSS2-20110607</a>
  3.1703 -    </dd>
  3.1704 +   </dd>
  3.1705     <!---->
  3.1706  
  3.1707     <dt id=CSS3-FONTS>[CSS3-FONTS]
  3.1708 @@ -4610,7 +3359,7 @@
  3.1709      Module Level 3.</cite></a> 23 August 2012. W3C Working Draft. (Work in
  3.1710      progress.) URL: <a
  3.1711      href="http://www.w3.org/TR/2012/WD-css3-fonts-20120823/">http://www.w3.org/TR/2012/WD-css3-fonts-20120823/</a>
  3.1712 -    </dd>
  3.1713 +   </dd>
  3.1714     <!---->
  3.1715  
  3.1716     <dt id=CSS3-WRITING-MODES>[CSS3-WRITING-MODES]
  3.1717 @@ -4620,17 +3369,7 @@
  3.1718      Writing Modes Module Level 3.</cite></a> 1 May 2012. W3C Working Draft.
  3.1719      (Work in progress.) URL: <a
  3.1720      href="http://www.w3.org/TR/2012/WD-css3-writing-modes-20120501/">http://www.w3.org/TR/2012/WD-css3-writing-modes-20120501/</a>
  3.1721 -    </dd>
  3.1722 -   <!---->
  3.1723 -
  3.1724 -   <dt id=CSS3BG>[CSS3BG]
  3.1725 -
  3.1726 -   <dd>Bert Bos; Elika J. Etemad; Brad Kemper. <a
  3.1727 -    href="http://www.w3.org/TR/2012/CR-css3-background-20120724/"><cite>CSS
  3.1728 -    Backgrounds and Borders Module Level 3.</cite></a> 24 July 2012. W3C
  3.1729 -    Candidate Recommendation. (Work in progress.) URL: <a
  3.1730 -    href="http://www.w3.org/TR/2012/CR-css3-background-20120724/">http://www.w3.org/TR/2012/CR-css3-background-20120724/</a>
  3.1731 -    </dd>
  3.1732 +   </dd>
  3.1733     <!---->
  3.1734  
  3.1735     <dt id=RFC2119>[RFC2119]
  3.1736 @@ -4639,7 +3378,7 @@
  3.1737      words for use in RFCs to Indicate Requirement Levels.</cite></a> Internet
  3.1738      RFC 2119. URL: <a
  3.1739      href="http://www.ietf.org/rfc/rfc2119.txt">http://www.ietf.org/rfc/rfc2119.txt</a>
  3.1740 -    </dd>
  3.1741 +   </dd>
  3.1742     <!---->
  3.1743  
  3.1744     <dt id=UAX11>[UAX11]
  3.1745 @@ -4648,7 +3387,7 @@
  3.1746      href="http://www.unicode.org/reports/tr11/"><cite>East Asian
  3.1747      Width.</cite></a> 17 January 2012. Unicode Standard Annex #11. URL: <a
  3.1748      href="http://www.unicode.org/reports/tr11/">http://www.unicode.org/reports/tr11/</a>
  3.1749 -    </dd>
  3.1750 +   </dd>
  3.1751     <!---->
  3.1752  
  3.1753     <dt id=UAX14>[UAX14]
  3.1754 @@ -4658,7 +3397,7 @@
  3.1755      Properties.</cite></a> 17 January 2012. Unicode Standard Annex #14. URL:
  3.1756      <a
  3.1757      href="http://www.unicode.org/unicode/reports/tr14/">http://www.unicode.org/unicode/reports/tr14/</a>
  3.1758 -    </dd>
  3.1759 +   </dd>
  3.1760     <!---->
  3.1761  
  3.1762     <dt id=UAX29>[UAX29]
  3.1763 @@ -4668,7 +3407,7 @@
  3.1764      Segmentation.</cite></a> 24 January 2012. Unicode Standard Annex #29.
  3.1765      URL: <a
  3.1766      href="http://www.unicode.org/reports/tr29/">http://www.unicode.org/reports/tr29/</a>
  3.1767 -    </dd>
  3.1768 +   </dd>
  3.1769     <!---->
  3.1770  
  3.1771     <dt id=UAX44>[UAX44]
  3.1772 @@ -4677,7 +3416,7 @@
  3.1773      href="http://www.unicode.org/reports/tr44/"><cite>Unicode Character
  3.1774      Database.</cite></a> 23 January 2012. Unicode Standard Annex #44. URL: <a
  3.1775      href="http://www.unicode.org/reports/tr44/">http://www.unicode.org/reports/tr44/</a>
  3.1776 -    </dd>
  3.1777 +   </dd>
  3.1778     <!---->
  3.1779  
  3.1780     <dt id=UNICODE>[UNICODE]
  3.1781 @@ -4688,7 +3427,7 @@
  3.1782      Version 4.0 (Boston, MA, Addison-Wesley, ISBN 0-321-18578-1), as updated
  3.1783      from time to time by the publication of new versions URL: <a
  3.1784      href="http://www.unicode.org/standard/versions/enumeratedversions.html">http://www.unicode.org/standard/versions/enumeratedversions.html</a>
  3.1785 -    </dd>
  3.1786 +   </dd>
  3.1787     <!---->
  3.1788    </dl>
  3.1789    <!--end-normative-->
  3.1790 @@ -4707,7 +3446,7 @@
  3.1791      href="http://www.w3.org/TR/2011/REC-css3-color-20110607"><cite>CSS Color
  3.1792      Module Level 3.</cite></a> 7 June 2011. W3C Recommendation. URL: <a
  3.1793      href="http://www.w3.org/TR/2011/REC-css3-color-20110607">http://www.w3.org/TR/2011/REC-css3-color-20110607</a>
  3.1794 -    </dd>
  3.1795 +   </dd>
  3.1796     <!---->
  3.1797  
  3.1798     <dt id=CSS3LIST>[CSS3LIST]
  3.1799 @@ -4717,7 +3456,7 @@
  3.1800      and Counters Module Level 3.</cite></a> 24 May 2011. W3C Working Draft.
  3.1801      (Work in progress.) URL: <a
  3.1802      href="http://www.w3.org/TR/2011/WD-css3-lists-20110524">http://www.w3.org/TR/2011/WD-css3-lists-20110524</a>
  3.1803 -    </dd>
  3.1804 +   </dd>
  3.1805     <!---->
  3.1806  
  3.1807     <dt id=CSS3VAL>[CSS3VAL]
  3.1808 @@ -4727,7 +3466,7 @@
  3.1809      Values and Units Module Level 3.</cite></a> 8 March 2012. W3C Working
  3.1810      Draft. (Work in progress.) URL: <a
  3.1811      href="http://www.w3.org/TR/2012/WD-css3-values-20120308/">http://www.w3.org/TR/2012/WD-css3-values-20120308/</a>
  3.1812 -    </dd>
  3.1813 +   </dd>
  3.1814     <!---->
  3.1815  
  3.1816     <dt id=HTML5>[HTML5]
  3.1817 @@ -4736,7 +3475,7 @@
  3.1818      href="http://www.w3.org/TR/2011/WD-html5-20110525/"><cite>HTML5.</cite></a>
  3.1819      25 May 2011. W3C Working Draft. (Work in progress.) URL: <a
  3.1820      href="http://www.w3.org/TR/2011/WD-html5-20110525/">http://www.w3.org/TR/2011/WD-html5-20110525/</a>
  3.1821 -    </dd>
  3.1822 +   </dd>
  3.1823     <!---->
  3.1824  
  3.1825     <dt id=JIS4051>[JIS4051]
  3.1826 @@ -4753,7 +3492,7 @@
  3.1827      for Japanese Text Layout.</cite></a> 3 April 2012. W3C Working Group
  3.1828      Note. URL: <a
  3.1829      href="http://www.w3.org/TR/2012/NOTE-jlreq-20120403/">http://www.w3.org/TR/2012/NOTE-jlreq-20120403/</a>
  3.1830 -    </dd>
  3.1831 +   </dd>
  3.1832     <!---->
  3.1833  
  3.1834     <dt id=XML10>[XML10]
  3.1835 @@ -4763,7 +3502,7 @@
  3.1836      Markup Language (XML) 1.0 (Fifth Edition).</cite></a> 26 November 2008.
  3.1837      W3C Recommendation. URL: <a
  3.1838      href="http://www.w3.org/TR/2008/REC-xml-20081126/">http://www.w3.org/TR/2008/REC-xml-20081126/</a>
  3.1839 -    </dd>
  3.1840 +   </dd>
  3.1841     <!---->
  3.1842  
  3.1843     <dt id=ZHMARK>[ZHMARK]
  3.1844 @@ -4777,48 +3516,20 @@
  3.1845    <h2 class=no-num id=changes>Appendix C: Changes</h2>
  3.1846  
  3.1847    <h3 class=no-num id=recent-changes> Changes from the <a
  3.1848 -   href="http://www.w3.org/TR/2012/WD-css3-text-20120119/">January 2012 CSS3
  3.1849 +   href="http://www.w3.org/TR/2012/WD-css3-text-20120823/">August 2012 CSS3
  3.1850     Text <abbr title="Working Draft">WD</abbr></a></h3>
  3.1851  
  3.1852    <p>Major changes include:
  3.1853  
  3.1854    <ul>
  3.1855 -   <li>Removed the ‘<code class=css>avoid</code>’ value of ‘<code
  3.1856 -    class=property>text-wrap</code>’, since it doesn't work very well with
  3.1857 -    the fact that ‘<code class=property>text-wrap</code>’ inherits.
  3.1858 -
  3.1859 -   <li>Dropped the ‘<code class=property>text-wrap</code>’ and ‘<code
  3.1860 -    class=property>text-space-collapse</code>’, leaving behind only the
  3.1861 -    CSS2.1 ‘<a href="#white-space0"><code
  3.1862 -    class=property>white-space</code></a>’ property.
  3.1863 -
  3.1864 -   <li>Removed ‘<code class=css>text-transform: full-size-kana</code>’.
  3.1865 -
  3.1866 -   <li>Disallowed combinations of values in ‘<a
  3.1867 -    href="#text-transform0"><code
  3.1868 -    class=property>text-transform</code></a>’.
  3.1869 +   <li>Shifted text decoration chapter to a separate <a
  3.1870 +    href="http://www.w3.org/TR/css3-text-decor/">Text Decoration module</a>
  3.1871    </ul>
  3.1872  
  3.1873    <p>Significant details updated:
  3.1874  
  3.1875    <ul>
  3.1876 -   <li>Defined aliasing of ‘<a href="#word-wrap"><code
  3.1877 -    class=property>word-wrap</code></a>’ and ‘<a
  3.1878 -    href="#overflow-wrap0"><code class=property>overflow-wrap</code></a>’.
  3.1879 -
  3.1880 -   <li>Defined interaction of alignment/indentation and ‘<code
  3.1881 -    class=css>unicode-bidi: plaintext</code>’.
  3.1882 -
  3.1883 -   <li>Added ‘<code class=css>text-align: match-parent</code>’ to
  3.1884 -    <code>&lt;option></code> elements.
  3.1885 -
  3.1886 -   <li>Improved terminology and clarified behavior in many instances.
  3.1887 -
  3.1888 -   <li>Defined that ‘<a href="#text-transform0"><code
  3.1889 -    class=property>text-transform</code></a>’ casing operations only affect
  3.1890 -    letters.
  3.1891 -
  3.1892 -   <li>Removed concept of "typographic modes".
  3.1893 +   <li>
  3.1894    </ul>
  3.1895  
  3.1896    <h2 class=no-num id=default-stylesheet>Appendix D: Default UA Stylesheet</h2>
  3.1897 @@ -5223,8 +3934,6 @@
  3.1898      selection and/or text wrapping, looping back into that step)
  3.1899  
  3.1900     <li><a href="#text-align">text alignment</a>
  3.1901 -
  3.1902 -   <li><a href="#decoration">text decoration</a>
  3.1903    </ol>
  3.1904  
  3.1905    <h2 class=no-num id=appendix-h-full-property-index>Appendix H: Full
  3.1906 @@ -5372,151 +4081,6 @@
  3.1907       <td>visual
  3.1908  
  3.1909      <tr>
  3.1910 -     <th><a class=property
  3.1911 -      href="#text-decoration-color0">text-decoration-color</a>
  3.1912 -
  3.1913 -     <td>&lt;color&gt;
  3.1914 -
  3.1915 -     <td>currentColor
  3.1916 -
  3.1917 -     <td>all elements
  3.1918 -
  3.1919 -     <td>no
  3.1920 -
  3.1921 -     <td>N/A
  3.1922 -
  3.1923 -     <td>visual
  3.1924 -
  3.1925 -    <tr>
  3.1926 -     <th><a class=property
  3.1927 -      href="#text-decoration-line0">text-decoration-line</a>
  3.1928 -
  3.1929 -     <td>none | [ underline || overline || line-through ]
  3.1930 -
  3.1931 -     <td>none
  3.1932 -
  3.1933 -     <td>all elements
  3.1934 -
  3.1935 -     <td>no (but see prose)
  3.1936 -
  3.1937 -     <td>N/A
  3.1938 -
  3.1939 -     <td>visual
  3.1940 -
  3.1941 -    <tr>
  3.1942 -     <th><a class=property
  3.1943 -      href="#text-decoration-skip0">text-decoration-skip</a>
  3.1944 -
  3.1945 -     <td>none | [ objects || spaces || ink || edges ]
  3.1946 -
  3.1947 -     <td>objects
  3.1948 -
  3.1949 -     <td>all elements
  3.1950 -
  3.1951 -     <td>yes
  3.1952 -
  3.1953 -     <td>N/A
  3.1954 -
  3.1955 -     <td>visual
  3.1956 -
  3.1957 -    <tr>
  3.1958 -     <th><a class=property href="#text-decoration0">text-decoration</a>
  3.1959 -
  3.1960 -     <td>&lt;text-decoration-line&gt; || &lt;text-decoration-style&gt; ||
  3.1961 -      &lt;text-decoration-color&gt; || blink
  3.1962 -
  3.1963 -     <td>none
  3.1964 -
  3.1965 -     <td>all elements
  3.1966 -
  3.1967 -     <td>no
  3.1968 -
  3.1969 -     <td>N/A
  3.1970 -
  3.1971 -     <td>visual
  3.1972 -
  3.1973 -    <tr>
  3.1974 -     <th><a class=property
  3.1975 -      href="#text-decoration-style0">text-decoration-style</a>
  3.1976 -
  3.1977 -     <td>solid | double | dotted | dashed | wavy
  3.1978 -
  3.1979 -     <td>solid
  3.1980 -
  3.1981 -     <td>all elements
  3.1982 -
  3.1983 -     <td>no
  3.1984 -
  3.1985 -     <td>N/A
  3.1986 -
  3.1987 -     <td>visual
  3.1988 -
  3.1989 -    <tr>
  3.1990 -     <th><a class=property
  3.1991 -      href="#text-emphasis-color0">text-emphasis-color</a>
  3.1992 -
  3.1993 -     <td>&lt;color&gt;
  3.1994 -
  3.1995 -     <td>currentColor
  3.1996 -
  3.1997 -     <td>all elements
  3.1998 -
  3.1999 -     <td>yes
  3.2000 -
  3.2001 -     <td>N/A
  3.2002 -
  3.2003 -     <td>visual
  3.2004 -
  3.2005 -    <tr>
  3.2006 -     <th><a class=property
  3.2007 -      href="#text-emphasis-position0">text-emphasis-position</a>
  3.2008 -
  3.2009 -     <td>[ above | below ] && [ right | left ]
  3.2010 -
  3.2011 -     <td>above right
  3.2012 -
  3.2013 -     <td>all elements
  3.2014 -
  3.2015 -     <td>yes
  3.2016 -
  3.2017 -     <td>N/A
  3.2018 -
  3.2019 -     <td>visual
  3.2020 -
  3.2021 -    <tr>
  3.2022 -     <th><a class=property href="#text-emphasis0">text-emphasis</a>
  3.2023 -
  3.2024 -     <td>‘&lt;text-emphasis-style&gt;’ ||
  3.2025 -      ‘&lt;text-emphasis-color&gt;’
  3.2026 -
  3.2027 -     <td>see individual properties
  3.2028 -
  3.2029 -     <td>all elements
  3.2030 -
  3.2031 -     <td>yes
  3.2032 -
  3.2033 -     <td>N/A
  3.2034 -
  3.2035 -     <td>visual
  3.2036 -
  3.2037 -    <tr>
  3.2038 -     <th><a class=property
  3.2039 -      href="#text-emphasis-style0">text-emphasis-style</a>
  3.2040 -
  3.2041 -     <td>none | [ [ filled | open ] || [ dot | circle | double-circle |
  3.2042 -      triangle | sesame ] ] | &lt;string&gt;
  3.2043 -
  3.2044 -     <td>none
  3.2045 -
  3.2046 -     <td>all elements
  3.2047 -
  3.2048 -     <td>yes
  3.2049 -
  3.2050 -     <td>N/A
  3.2051 -
  3.2052 -     <td>visual
  3.2053 -
  3.2054 -    <tr>
  3.2055       <th><a class=property href="#text-indent0">text-indent</a>
  3.2056  
  3.2057       <td>[ &lt;length&gt; | &lt;percentage&gt; ] && [ hanging || each-line ]?
  3.2058 @@ -5548,9 +4112,9 @@
  3.2059       <td>visual
  3.2060  
  3.2061      <tr>
  3.2062 -     <th><a class=property href="#text-shadow0">text-shadow</a>
  3.2063 -
  3.2064 -     <td>none | [ &lt;length>{2,3} && &lt;color>? ]#
  3.2065 +     <th><a class=property href="#text-transform0">text-transform</a>
  3.2066 +
  3.2067 +     <td>none | capitalize | uppercase | lowercase | full-width
  3.2068  
  3.2069       <td>none
  3.2070  
  3.2071 @@ -5563,37 +4127,6 @@
  3.2072       <td>visual
  3.2073  
  3.2074      <tr>
  3.2075 -     <th><a class=property href="#text-transform0">text-transform</a>
  3.2076 -
  3.2077 -     <td>none | capitalize | uppercase | lowercase | full-width
  3.2078 -
  3.2079 -     <td>none
  3.2080 -
  3.2081 -     <td>all elements
  3.2082 -
  3.2083 -     <td>yes
  3.2084 -
  3.2085 -     <td>N/A
  3.2086 -
  3.2087 -     <td>visual
  3.2088 -
  3.2089 -    <tr>
  3.2090 -     <th><a class=property
  3.2091 -      href="#text-underline-position0">text-underline-position</a>
  3.2092 -
  3.2093 -     <td>auto | alphabetic | [ below || [ left | right ] ]
  3.2094 -
  3.2095 -     <td>auto
  3.2096 -
  3.2097 -     <td>all elements
  3.2098 -
  3.2099 -     <td>yes
  3.2100 -
  3.2101 -     <td>N/A
  3.2102 -
  3.2103 -     <td>visual
  3.2104 -
  3.2105 -    <tr>
  3.2106       <th><a class=property href="#white-space0">white-space</a>
  3.2107  
  3.2108       <td>normal | pre | nowrap | pre-wrap | pre-line

     4.1 --- a/css3-text/Overview.src.html	Wed Sep 05 14:51:46 2012 -0700
     4.2 +++ b/css3-text/Overview.src.html	Wed Sep 05 14:53:15 2012 -0700
     4.3 @@ -1,10 +1,13 @@
     4.4 -<!DOCTYPE html public '-//W3C//DTD HTML 4.01//EN'
     4.5 -  'http://www.w3.org/TR/html4/strict.dtd'>
     4.6 +<!DOCTYPE html>
     4.7  <html lang="en">
     4.8  <head>
     4.9    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    4.10 -  <title>CSS Text Level 3</title>
    4.11 +  <title>CSS Text Module Level 3 (CSS3 Text)</title>
    4.12 +  <link rel=contents href="#contents">
    4.13 +  <link rel=index href="#index">
    4.14    <link rel="stylesheet" type="text/css" href="../default.css">
    4.15 +  <link rel="stylesheet" type="text/css"
    4.16 +        href="http://www.w3.org/StyleSheets/TR/W3C-[STATUS].css">
    4.17  
    4.18    <style type="text/css">
    4.19      .egbidiwsaA,.egbidiwsbB,.egbidiwsaB,.egbidiwsbC
    4.20 @@ -31,7 +34,7 @@
    4.21  
    4.22  <!--logo-->
    4.23  
    4.24 -<h1>CSS Text Level 3</h1>
    4.25 +<h1>CSS Text Module Level 3</h1>
    4.26  
    4.27  <h2 class="no-num no-toc">[LONGSTATUS] [DATE]</h2>
    4.28  
    4.29 @@ -72,7 +75,7 @@
    4.30  
    4.31    <p>This CSS3 module defines properties for text manipulation and
    4.32      specifies their processing model. It covers line breaking, justification
    4.33 -    and alignment, white space handling, text decoration and text
    4.34 +    and alignment, white space handling, and text
    4.35      transformation.</p>
    4.36  
    4.37  <h2 class="no-num no-toc" id="status">Status of This Document</h2>
    4.38 @@ -168,13 +171,6 @@
    4.39    keyword as their property value. For readability it has not been repeated
    4.40    explicitly.
    4.41  
    4.42 -  <p>The <dfn>''currentcolor''</dfn> keyword here computes to itself and is
    4.43 -  resolved to the value of 'color' after inheritance is performed. This is
    4.44 -  so that the 'text-emphasis-color' by default matches the text 'color'.
    4.45 -  <span class="issue">CSS3 Color has not yet been errata'd to define it this way;
    4.46 -  currentcolor there is defined to compute to the value of 'color',
    4.47 -  which gives it the wrong inheritance behavior.</span>
    4.48 -
    4.49  <h3 id="terms">
    4.50  Terminology</h3>
    4.51  
    4.52 @@ -222,7 +218,6 @@
    4.53      Transforming Text: the 'text-transform' property</h3>
    4.54  
    4.55      <table class="propdef">
    4.56 -      <tbody>
    4.57          <tr>
    4.58            <th>Name:</th>
    4.59            <td><dfn>text-transform</dfn></td>
    4.60 @@ -256,7 +251,6 @@
    4.61            <th>Computed&#160;value:</th>
    4.62            <td>as specified</td>
    4.63          </tr>
    4.64 -      </tbody>
    4.65      </table>
    4.66  
    4.67      <p>This property transforms text for styling purposes.
    4.68 @@ -377,7 +371,6 @@
    4.69    </ul>
    4.70  
    4.71    <table class="propdef">
    4.72 -    <tbody>
    4.73        <tr>
    4.74          <th>Name:</th>
    4.75          <td><dfn>white-space</dfn></td>
    4.76 @@ -410,7 +403,6 @@
    4.77          <th>Computed&#160;value:</th>
    4.78          <td>see individual properties</td>
    4.79        </tr>
    4.80 -    </tbody>
    4.81    </table>
    4.82  
    4.83    <p>Values have the following meanings, which must be interpreted
    4.84 @@ -682,7 +674,6 @@
    4.85      Tab Character Size: the 'tab-size' property</h3>
    4.86  
    4.87      <table class="propdef">
    4.88 -      <tbody>
    4.89          <tr>
    4.90            <th>Name:</th>
    4.91            <td><dfn>tab-size</dfn></td>
    4.92 @@ -715,7 +706,6 @@
    4.93            <th>Computed&#160;value:</th>
    4.94            <td>the specified integer or length made absolute</td>
    4.95          </tr>
    4.96 -      </tbody>
    4.97      </table>
    4.98  
    4.99      <p>This property determines the <i>tab size</i> used to render preserved tab characters (U+0009).
   4.100 @@ -815,7 +805,6 @@
   4.101      Breaking Rules for Punctuation: the 'line-break' property</h3>
   4.102  
   4.103      <table class="propdef">
   4.104 -      <tbody>
   4.105          <tr>
   4.106            <th>Name:</th>
   4.107            <td><dfn>line-break</dfn></td>
   4.108 @@ -848,7 +837,6 @@
   4.109            <th>Computed&#160;value:</th>
   4.110            <td>specified value</td>
   4.111          </tr>
   4.112 -      </tbody>
   4.113      </table>
   4.114  
   4.115      <p>This property specifies the strictness of line-breaking rules applied
   4.116 @@ -937,7 +925,6 @@
   4.117      Breaking Rules for Letters: the 'word-break' property</h3>
   4.118  
   4.119      <table class="propdef">
   4.120 -      <tbody>
   4.121          <tr>
   4.122            <th>Name:</th>
   4.123            <td><dfn>word-break</dfn></td>
   4.124 @@ -970,7 +957,6 @@
   4.125            <th>Computed&#160;value:</th>
   4.126            <td>specified value</td>
   4.127          </tr>
   4.128 -      </tbody>
   4.129      </table>
   4.130  
   4.131      <p>This property specifies <i>soft wrap opportunities</i> between letters.
   4.132 @@ -1133,7 +1119,6 @@
   4.133      Overflow Wrapping: the 'word-wrap'/'overflow-wrap' property</h3>
   4.134  
   4.135      <table class="propdef">
   4.136 -      <tbody>
   4.137          <tr>
   4.138            <th>Name:</th>
   4.139            <td><dfn>overflow-wrap</dfn>/<dfn>word-wrap</dfn></td>
   4.140 @@ -1166,7 +1151,6 @@
   4.141            <th>Computed&#160;value:</th>
   4.142            <td>specified value</td>
   4.143          </tr>
   4.144 -      </tbody>
   4.145      </table>
   4.146  
   4.147      <p>This property specifies whether the UA may arbitrarily break within a word
   4.148 @@ -1202,7 +1186,6 @@
   4.149      Text Alignment: the 'text-align' property</h3>
   4.150  
   4.151      <table class="propdef">
   4.152 -      <tbody>
   4.153          <tr>
   4.154            <th>Name:</th>
   4.155            <td><dfn>text-align</dfn></td>
   4.156 @@ -1237,7 +1220,6 @@
   4.157            <th>Computed&#160;value:</th>
   4.158            <td>specified value, except for 'match-parent' (see prose)</td>
   4.159          </tr>
   4.160 -      </tbody>
   4.161      </table>
   4.162  
   4.163      <p>This property describes how inline contents of a block are aligned along
   4.164 @@ -1479,7 +1461,6 @@
   4.165      Last Line Alignment: the 'text-align-last' property</h3>
   4.166  
   4.167      <table class="propdef">
   4.168 -      <tbody>
   4.169          <tr>
   4.170            <th>Name:</th>
   4.171            <td><dfn>text-align-last</dfn></td>
   4.172 @@ -1513,7 +1494,6 @@
   4.173            <th>Computed&#160;value:</th>
   4.174            <td>specified value</td>
   4.175          </tr>
   4.176 -      </tbody>
   4.177      </table>
   4.178  
   4.179      <p>This property describes how the last line of a block or a line
   4.180 @@ -1533,7 +1513,6 @@
   4.181      Justification Method: the 'text-justify' property</h3>
   4.182  
   4.183      <table class="propdef">
   4.184 -      <tbody>
   4.185          <tr>
   4.186            <th>Name:</th>
   4.187            <td><dfn>text-justify</dfn></td>
   4.188 @@ -1568,7 +1547,6 @@
   4.189            <th>Computed&#160;value:</th>
   4.190            <td>specified value</td>
   4.191          </tr>
   4.192 -      </tbody>
   4.193      </table>
   4.194  
   4.195      <p>This property selects the justification method used when a line's
   4.196 @@ -1954,7 +1932,6 @@
   4.197      Word Spacing: the 'word-spacing' property</h3>
   4.198  
   4.199      <table class="propdef">
   4.200 -      <tbody>
   4.201          <tr>
   4.202            <th>Name:</th>
   4.203            <td><dfn>word-spacing</dfn></td>
   4.204 @@ -1989,7 +1966,6 @@
   4.205            <td>an optimum, minimum, and maximum value,
   4.206              each consisting of either an absolute length, a percentage, or the keyword ''normal''
   4.207          </tr>
   4.208 -      </tbody>
   4.209      </table>
   4.210  
   4.211      <p>This property specifies the minimum, maximum, and optimal spacing
   4.212 @@ -2030,7 +2006,6 @@
   4.213      Tracking: the 'letter-spacing' property</h3>
   4.214  
   4.215      <table class="propdef">
   4.216 -      <tbody>
   4.217          <tr>
   4.218            <th>Name:</th>
   4.219            <td><dfn>letter-spacing</dfn></td>
   4.220 @@ -2065,7 +2040,6 @@
   4.221            <td>an optimum, minimum, and maximum value,
   4.222              each consisting of either an absolute length or the keyword ''normal''
   4.223          </tr>
   4.224 -      </tbody>
   4.225      </table>
   4.226  
   4.227      <p>This property specifies the minimum, maximum, and optimal spacing
   4.228 @@ -2127,7 +2101,6 @@
   4.229      First Line Indentation: the 'text-indent' property</h3>
   4.230  
   4.231      <table class="propdef">
   4.232 -      <tbody>
   4.233          <tr>
   4.234            <th>Name:</th>
   4.235            <td><dfn>text-indent</dfn></td>
   4.236 @@ -2164,7 +2137,6 @@
   4.237            <td>the percentage as specified or the absolute length,
   4.238              plus any keywords as specified
   4.239          </tr>
   4.240 -      </tbody>
   4.241      </table>
   4.242  
   4.243      <p>This property specifies the indentation applied to lines of inline
   4.244 @@ -2215,7 +2187,6 @@
   4.245      Hanging Punctuation: the 'hanging-punctuation' property</h3>
   4.246  
   4.247      <table class="propdef">
   4.248 -      <tbody>
   4.249          <tr>
   4.250            <th>Name:</th>
   4.251            <td><dfn>hanging-punctuation</dfn></td>
   4.252 @@ -2249,7 +2220,6 @@
   4.253            <th>Computed&#160;value:</th>
   4.254            <td>as specified</td>
   4.255          </tr>
   4.256 -      </tbody>
   4.257      </table>
   4.258  
   4.259      <p>This property determines whether a punctuation mark, if one is present,
   4.260 @@ -2361,991 +2331,22 @@
   4.261  <h2 id="decoration">
   4.262    <a name="text-decoration">Text Decoration</a></h2>
   4.263  
   4.264 -  <h3 id="line-decoration">
   4.265 -    Line Decoration: Underline, Overline, and Strike-Through</h3>
   4.266 -
   4.267 -    <p>The following properties describe line decorations that are added
   4.268 -      to the content of an element. When specified on or propagated to
   4.269 -      an inline box, such decoration affects all the boxes generated
   4.270 -      by that element, and is further propagated to any in-flow block-level
   4.271 -      boxes that split the inline
   4.272 -      (see <a href="http://www.w3.org/TR/CSS21/visuren.html#anonymous-block-level">CSS2.1 section 9.2.1.1</a>)
   4.273 -      When specified on or propagated to a ruby box, the decorations are
   4.274 -      further propagated only to the ruby base.
   4.275 -      When specified on or propagated to a a block container that establishes
   4.276 -      an inline formatting context, the decorations are propagated to an
   4.277 -      anonymous inline element that wraps all the in-flow inline-level children
   4.278 -      of the block container. For all other elements, the decorations are
   4.279 -      propagated to any in-flow children.
   4.280 -
   4.281 -    <p class="note">Note that text decorations are not propagated to any
   4.282 -      out-of-flow descendants, nor to the contents of atomic inline-level
   4.283 -      descendants such as inline blocks and inline tables.
   4.284 -
   4.285 -    <p>By default underlines, overlines, and line-throughs are applied only
   4.286 -      to text (including white space, letter spacing, and word spacing):
   4.287 -      margins, borders, and padding are skipped. Elements containing
   4.288 -      no text, such as images, are likewise not decorated.
   4.289 -      The 'text-decoration-skip'
   4.290 -      property can be used to modify this behavior, for example allowing
   4.291 -      inline replaced elements to be underlined or requiring that white
   4.292 -      space be skipped.
   4.293 -
   4.294 -    <p>In determining the position and thickness of text decoration lines,
   4.295 -      user agents may consider the font sizes and dominant baselines of
   4.296 -      descendants, but for a given element's decoration must use the same
   4.297 -      position and thickness throughout each line box. The
   4.298 -      <a href="#text-decoration-color">color</a> and
   4.299 -      <a href="#text-decoration-style">line style</a> of decorations must
   4.300 -      remain the same on all decorations applied by a given element, even
   4.301 -      if descendant elements have different color or line style values.</p>
   4.302 -
   4.303 -    <div class="example">
   4.304 -      <p>The following figure shows the averaging for underline:
   4.305 -      <p><img alt="In the first rendering of the underlined text '1st a'
   4.306 -                   with 'st' as a superscript, both the '1st' and the 'a'
   4.307 -                   are rendered in a small font. In the second rendering,
   4.308 -                   the 'a' is rendered in a larger font. In the third, both
   4.309 -                   '1st' and 'a' are large."
   4.310 -              height="105" src="underline-averaging.gif" width="326">
   4.311 -      <p>In the three fragments of underlined text, the underline is drawn
   4.312 -        consecutively lower and thicker as the ratio of large text to small
   4.313 -        text increases.</p>
   4.314 -    </div>
   4.315 -
   4.316 -    <p>Relatively positioning a descendant moves all text decorations
   4.317 -      affecting it along with the descendant's text; it does not affect
   4.318 -      calculation of the decoration's initial position on that line.
   4.319 -      The 'visibility' property, filters, and other graphical transformations
   4.320 -      likewise affect text decorations as part of the text they're drawn on,
   4.321 -      even if the decorations were specified on an ancestor element.
   4.322 -      <span class="issue">Does this include 'text-shadow'? What about text-fill etc.?</span>
   4.323 -
   4.324 -    <div class="example">
   4.325 -      <p>In the following style sheet and document fragment:</p>
   4.326 -      <pre><code class="css">
   4.327 -<!-- -->   blockquote { text-decoration: underline; color: blue; }
   4.328 -<!-- -->   em { display: block; }
   4.329 -<!-- -->   cite { color: fuchsia; }
   4.330 -<!----></code></pre>
   4.331 -      <pre class="html"><code>
   4.332 -<!-- -->   &lt;blockquote&gt;
   4.333 -<!-- -->    &lt;p&gt;
   4.334 -<!-- -->     &lt;span&gt;
   4.335 -<!-- -->      Help, help!
   4.336 -<!-- -->      &lt;em&gt; I am under a hat! &lt;/em&gt;
   4.337 -<!-- -->
   4.338 -<!-- -->      &lt;cite&gt; &mdash;GwieF &lt;/cite&gt;
   4.339 -<!-- -->     &lt;/span&gt;
   4.340 -<!-- -->    &lt;/p&gt;
   4.341 -<!-- -->   &lt;/blockquote&gt;
   4.342 -<!----></code></pre>
   4.343 -      <p>...the underlining for the blockquote element is propagated to an
   4.344 -      anonymous inline element that surrounds the span element, causing
   4.345 -      the text "Help, help!" to be blue, with the blue underlining from
   4.346 -      the anonymous inline underneath it, the color being taken from the
   4.347 -      blockquote element. The <code>&lt;em&gt;text&lt;/em&gt;</code>
   4.348 -      in the em block is also underlined, as it is in an in-flow block to
   4.349 -      which the underline is propagated. The final line of text is fuchsia,
   4.350 -      but the underline underneath it is still the blue underline from the
   4.351 -      anonymous inline element.</p>
   4.352 -      <p><img src="underline-example.png" alt="Sample rendering of the above underline example"></p>
   4.353 -      <p>This diagram shows the boxes involved in the example above. The
   4.354 -      rounded aqua line represents the anonymous inline element wrapping
   4.355 -      the inline contents of the paragraph element, the rounded blue line
   4.356 -      represents the span element, and the orange lines represent the
   4.357 -      blocks.</p>
   4.358 -    </div>
   4.359 -
   4.360 -    <h4 id="text-decoration-line">
   4.361 -      Text Decoration Lines: the 'text-decoration-line' property</h4>
   4.362 -
   4.363 -      <table class="propdef">
   4.364 -        <tbody>
   4.365 -          <tr>
   4.366 -            <th>Name:</th>
   4.367 -            <td><dfn>text-decoration-line</dfn></td>
   4.368 -          </tr>
   4.369 -          <tr>
   4.370 -            <th><a href="#values">Value</a>:
   4.371 -            <td>none | [ underline || overline || line-through ]
   4.372 -            </td>
   4.373 -          </tr>
   4.374 -          <tr>
   4.375 -            <th>Initial:</th>
   4.376 -            <td>none</td>
   4.377 -          </tr>
   4.378 -          <tr>
   4.379 -            <th>Applies to:</th>
   4.380 -            <td>all elements</td>
   4.381 -          </tr>
   4.382 -          <tr>
   4.383 -            <th>Inherited:</th>
   4.384 -            <td>no (but see prose)</td>
   4.385 -          </tr>
   4.386 -          <tr>
   4.387 -            <th>Percentages:</th>
   4.388 -            <td>N/A</td>
   4.389 -          </tr>
   4.390 -          <tr>
   4.391 -            <th>Media:</th>
   4.392 -            <td>visual</td>
   4.393 -          </tr>
   4.394 -          <tr>
   4.395 -            <th>Computed&#160;value:</th>
   4.396 -            <td>as specified</td>
   4.397 -          </tr>
   4.398 -        </tbody>
   4.399 -      </table>
   4.400 -
   4.401 -      <p>Specifies what line decorations, if any, are added to the element.
   4.402 -        Values have the following meanings:</p>
   4.403 -
   4.404 -      <dl>
   4.405 -        <dt><dfn title="text-decoration-line:none">''none''</dfn>
   4.406 -          <dd>Neither produces nor inhibits text decoration.
   4.407 -        <dt><dfn>''underline''</dfn>
   4.408 -          <dd>Each line of text is underlined.
   4.409 -        <dt><dfn>''overline''</dfn>
   4.410 -          <dd>Each line of text has a line above it (i.e. on the opposite
   4.411 -          side from an underline).
   4.412 -        <dt><dfn>''line-through''</dfn>
   4.413 -          <dd>Each line of text has a line through the middle.
   4.414 -      </dl>
   4.415 -
   4.416 -    <h4 id="text-decoration-color">
   4.417 -      Text Decoration Color: the 'text-decoration-color' property</h4>
   4.418 -
   4.419 -      <table class="propdef">
   4.420 -        <tbody>
   4.421 -          <tr>
   4.422 -            <th>Name:</th>
   4.423 -            <td><dfn>text-decoration-color</dfn></td>
   4.424 -          </tr>
   4.425 -          <tr>
   4.426 -            <th><a href="#values">Value</a>:
   4.427 -            <td><a href="http://www.w3.org/TR/css3-color/#color0"><span class="value-inst-color">&lt;color&gt;</span></a>
   4.428 -            </td>
   4.429 -          </tr>
   4.430 -          <tr>
   4.431 -            <th>Initial:</th>
   4.432 -            <td><a href="http://www.w3.org/TR/css3-color/#currentcolor">currentColor</a></td>
   4.433 -          </tr>
   4.434 -          <tr>
   4.435 -            <th>Applies to:</th>
   4.436 -            <td>all elements</td>
   4.437 -          </tr>
   4.438 -          <tr>
   4.439 -            <th>Inherited:</th>
   4.440 -            <td>no</td>
   4.441 -          </tr>
   4.442 -          <tr>
   4.443 -            <th>Percentages:</th>
   4.444 -            <td>N/A</td>
   4.445 -          </tr>
   4.446 -          <tr>
   4.447 -            <th>Media:</th>
   4.448 -            <td>visual</td>
   4.449 -          </tr>
   4.450 -          <tr>
   4.451 -            <th>Computed&#160;value:</th>
   4.452 -            <td>the computed color </td>
   4.453 -          </tr>
   4.454 -        </tbody>
   4.455 -      </table>
   4.456 -
   4.457 -      <p>This property specifies the color of text decoration (underlines
   4.458 -        overlines, and line-throughs) set on the element with
   4.459 -        'text-decoration-line'.</p>
   4.460 -
   4.461 -    <h4 id="text-decoration-style">
   4.462 -      Text Decoration Style: the 'text-decoration-style' property</h4>
   4.463 -
   4.464 -      <table class="propdef">
   4.465 -        <tbody>
   4.466 -          <tr>
   4.467 -            <th>Name:</th>
   4.468 -            <td><dfn>text-decoration-style</dfn></td>
   4.469 -          </tr>
   4.470 -          <tr>
   4.471 -            <th><a href="#values">Value</a>:
   4.472 -            <td>solid | double | dotted | dashed | wavy
   4.473 -            </td>
   4.474 -          </tr>
   4.475 -          <tr>
   4.476 -            <th>Initial:</th>
   4.477 -            <td>solid</td>
   4.478 -          </tr>
   4.479 -          <tr>
   4.480 -            <th>Applies to:</th>
   4.481 -            <td>all elements</td>
   4.482 -          </tr>
   4.483 -          <tr>
   4.484 -            <th>Inherited:</th>
   4.485 -            <td>no</td>
   4.486 -          </tr>
   4.487 -          <tr>
   4.488 -            <th>Percentages:</th>
   4.489 -            <td>N/A</td>
   4.490 -          </tr>
   4.491 -          <tr>
   4.492 -            <th>Media:</th>
   4.493 -            <td>visual</td>
   4.494 -          </tr>
   4.495 -          <tr>
   4.496 -            <th>Computed&#160;value:</th>
   4.497 -            <td>as specified</td>
   4.498 -          </tr>
   4.499 -        </tbody>
   4.500 -      </table>
   4.501 -
   4.502 -      <p>This property specifies the style of the line(s) drawn for
   4.503 -        text decoration specified on the element. Values have the
   4.504 -        same meaning as for the
   4.505 -        <a href="http://www.w3.org/TR/css3-background/#the-border-style">border-style
   4.506 -        properties</a> [[!CSS3BG]]. ''wavy'' indicates a wavy line.</p>
   4.507 -
   4.508 -    <h4 id="text-decoration">
   4.509 -      Text Decoration Shorthand: the 'text-decoration' property</h4>
   4.510 -
   4.511 -      <table class="propdef">
   4.512 -        <tbody>
   4.513 -          <tr>
   4.514 -            <th>Name:</th>
   4.515 -            <td><dfn>text-decoration</dfn></td>
   4.516 -          </tr>
   4.517 -          <tr>
   4.518 -            <th><a href="#values">Value</a>:
   4.519 -            <td><var><a href="#text-decoration-line">&lt;text-decoration-line&gt;</a></var> ||
   4.520 -                <var><a href="#text-decoration-style">&lt;text-decoration-style&gt;</a></var> ||
   4.521 -                <var><a href="#text-decoration-color">&lt;text-decoration-color&gt;</a></var> || blink
   4.522 -            </td>
   4.523 -          </tr>
   4.524 -          <tr>
   4.525 -            <th>Initial:</th>
   4.526 -            <td>none</td>
   4.527 -          </tr>
   4.528 -          <tr>
   4.529 -            <th>Applies to:</th>
   4.530 -            <td>all elements</td>
   4.531 -          </tr>
   4.532 -          <tr>
   4.533 -            <th>Inherited:</th>
   4.534 -            <td>no</td>
   4.535 -          </tr>
   4.536 -          <tr>
   4.537 -            <th>Percentages:</th>
   4.538 -            <td>N/A</td>
   4.539 -          </tr>
   4.540 -          <tr>
   4.541 -            <th>Media:</th>
   4.542 -            <td>visual</td>
   4.543 -          </tr>
   4.544 -          <tr>
   4.545 -            <th>Computed&#160;value:</th>
   4.546 -            <td>as specified</td>
   4.547 -          </tr>
   4.548 -        </tbody>
   4.549 -      </table>
   4.550 -
   4.551 -      <p>This property is a shorthand for setting 'text-decoration-line',
   4.552 -        'text-decoration-color', and 'text-decoration-style' in one declaration.
   4.553 -        Omitted values are set to their initial values. A 'text-decoration'
   4.554 -        declaration that omits both the 'text-decoration-color'
   4.555 -        and 'text-decoration-style' values is backwards-compatible
   4.556 -        with CSS Levels 1 and 2.</p>
   4.557 -
   4.558 -      <p>If the ''blink'' keyword is specified the text blinks
   4.559 -        (alternates between visible and invisible). Conforming user agents
   4.560 -        may simply not blink the text. Note that not blinking the text is
   4.561 -        one technique to satisfy
   4.562 -        <a href="http://www.w3.org/TR/UAAG/guidelines.html#tech-on-off-blinking-text">checkpoint 3.3 of WAI-UAAG</a>.</p>
   4.563 -
   4.564 -      <div class="example">
   4.565 -        <p>The following example underlines unvisited links with a solid blue
   4.566 -        underline in CSS1 and CSS2 UAs and a navy dotted underline in CSS3 UAs.</p>
   4.567 -
   4.568 -        <pre><code class="css">
   4.569 -<!--   -->:link {
   4.570 -<!--   -->    color: blue;
   4.571 -<!--   -->    text-decoration: underline;
   4.572 -<!--   -->    text-decoration: navy dotted underline; /* <a href="http://www.w3.org/TR/CSS21/syndata.html#ignore">Ignored</a> in CSS1/CSS2 UAs */
   4.573 -<!--   -->}
   4.574 -<!-- --></code></pre>
   4.575 -      </div>
   4.576 -
   4.577 -    <h4 id="text-decoration-skip">
   4.578 -      Text Decoration Line Continuity: the 'text-decoration-skip' property</h4>
   4.579 -
   4.580 -      <table class="propdef">
   4.581 -        <tbody>
   4.582 -          <tr>
   4.583 -            <th>Name:</th>
   4.584 -            <td><dfn>text-decoration-skip</dfn></td>
   4.585 -          </tr>
   4.586 -          <tr>
   4.587 -            <th><a href="#values">Value</a>:
   4.588 -            <td>none | [ objects || spaces || ink || edges ]
   4.589 -            </td>
   4.590 -          </tr>
   4.591 -          <tr>
   4.592 -            <th>Initial:</th>
   4.593 -            <td>objects</td>
   4.594 -          </tr>
   4.595 -          <tr>
   4.596 -            <th>Applies to:</th>
   4.597 -            <td>all elements</td>
   4.598 -          </tr>
   4.599 -          <tr>
   4.600 -            <th>Inherited:</th>
   4.601 -            <td>yes</td>
   4.602 -          </tr>
   4.603 -          <tr>
   4.604 -            <th>Percentages:</th>
   4.605 -            <td>N/A</td>
   4.606 -          </tr>
   4.607 -          <tr>
   4.608 -            <th>Media:</th>
   4.609 -            <td>visual</td>
   4.610 -          </tr>
   4.611 -          <tr>
   4.612 -            <th>Computed&#160;value:</th>
   4.613 -            <td>as specified</td>
   4.614 -          </tr>
   4.615 -        </tbody>
   4.616 -      </table>
   4.617 -
   4.618 -        <p>This property specifies what parts of the element's content
   4.619 -        any text decoration affecting the element must skip over. It
   4.620 -        controls all text decoration lines drawn by the element
   4.621 -        and also any text decoration lines drawn by its ancestors.
   4.622 -        Values have the following meanings:</p>
   4.623 -
   4.624 -      <dl>
   4.625 -        <dt><dfn title="text-decoration-skip:none">''none''</dfn></dt>
   4.626 -        <dd>Skip nothing: text-decoration is drawn for all text content
   4.627 -          and for inline replaced elements.</dd>
   4.628 -        <dt><dfn title="text-decoration-skip:objects">''objects''</dfn></dt>
   4.629 -        <dd>Skip this element if it is an atomic inline (such as an
   4.630 -          image or inline-block).</dd>
   4.631 -        <dt><dfn title="text-decoration-skip:spaces">''spaces''</dfn></dt>
   4.632 -        <dd>Skip white space: this includes regular spaces (U+0020) and
   4.633 -          tabs (U+0009), as well as nbsp (U+00A0), ideographic space
   4.634 -          (U+3000), all fixed width spaces (such as U+2000&ndash;U+200A,
   4.635 -          U+202F and U+205F), and any adjacent letter-spacing or
   4.636 -          word-spacing.</dd>
   4.637 -        <dt><dfn title="text-decoration-skip:ink">''ink''</dfn></dt>
   4.638 -        <dd>Skip over where glyphs are drawn: interrupt the decoration
   4.639 -          line to let text show through where the text decoration would
   4.640 -          otherwise cross over a glyph. The UA may also skip a small
   4.641 -          distance to either side of the glyph outline.</dd>
   4.642 -        <dt><dfn title="text-decoration-skip:edges">''edges''</dfn></dt>
   4.643 -        <dd>The UA should place the start and end of the line inwards from
   4.644 -          the content edge of the decorating element so that, e.g. two
   4.645 -          underlined elements side-by-side do not appear to have a single
   4.646 -          underline. (This is important in Chinese, where underlining is a
   4.647 -          form of punctuation.)</dd>
   4.648 -      </dl>
   4.649 -
   4.650 -      <p class="issue">Do we need a value that <em>doesn't</em> skip
   4.651 -        margins and padding?</p>
   4.652 -
   4.653 -      <p class="note">Note that this property inherits and that descendant
   4.654 -        elements can have a different setting.</p>
   4.655 -
   4.656 -    <h4 id="text-underline-position">
   4.657 -      Text Underline Position: the 'text-underline-position' property</h4>
   4.658 -
   4.659 -      <table class="propdef">
   4.660 -        <tbody>
   4.661 -          <tr>
   4.662 -            <th>Name:</th>
   4.663 -            <td><dfn>text-underline-position</dfn></td>
   4.664 -          </tr>
   4.665 -          <tr>
   4.666 -            <th><a href="#values">Value</a>:
   4.667 -            <td>auto | alphabetic | [ below || [ left | right ] ]
   4.668 -            </td>
   4.669 -          </tr>
   4.670 -          <tr>
   4.671 -            <th>Initial:</th>
   4.672 -            <td>auto</td>
   4.673 -          </tr>
   4.674 -          <tr>
   4.675 -            <th>Applies to:</th>
   4.676 -            <td>all elements</td>
   4.677 -          </tr>
   4.678 -          <tr>
   4.679 -            <th>Inherited:</th>
   4.680 -            <td>yes</td>
   4.681 -          </tr>
   4.682 -          <tr>
   4.683 -            <th>Percentages:</th>
   4.684 -            <td>N/A</td>
   4.685 -          </tr>
   4.686 -          <tr>
   4.687 -            <th>Media:</th>
   4.688 -            <td>visual</td>
   4.689 -          </tr>
   4.690 -          <tr>
   4.691 -            <th>Computed&#160;value:</th>
   4.692 -            <td>as specified</td>
   4.693 -          </tr>
   4.694 -        </tbody>
   4.695 -      </table>
   4.696 -
   4.697 -      <p>This property sets the position of an underline specified
   4.698 -        on the same element: it does not affect underlines specified by
   4.699 -        ancestor elements. Values have the following meanings:</p>
   4.700 -
   4.701 -      <dl>
   4.702 -        <dt><dfn>''auto''</dfn></dt>
   4.703 -        <dd>The user agent may use any algorithm to determine the
   4.704 -          underline's position; however it must be placed at or below
   4.705 -          the alphabetic baseline.
   4.706 -          <p class="note">It is suggested that the underline position
   4.707 -          be ''alphabetic'' unless it crosses either subscripted (or
   4.708 -          otherwise lowered) text, or it affects characters from Asian
   4.709 -          scripts such as Han or Tibetan, for which an alphabetic
   4.710 -          underline is too high: in such cases, aligning to the em box
   4.711 -          edge as described for ''below left'' is more appropriate.
   4.712 -        <dt><dfn>''alphabetic''</dfn></dt>
   4.713 -        <dd>The underline is positioned relative to the alphabetic baseline. In
   4.714 -          this case the underline is likely to cross some descenders.
   4.715 -          <div class="figure">
   4.716 -            <p><img title="text-underline-position: alphabetic"
   4.717 -                alt="In a typical Latin font, the underline is positioned slightly
   4.718 -                     below the alphabetic baseline, leaving a gap between the line
   4.719 -                     and the bottom of most Latin letters, but crossing through
   4.720 -                     descenders such as the stem of a 'p'."
   4.721 -                src="underline-position-alphabetic.png"
   4.722 -                >
   4.723 -            <p class="caption">''text-underline-position: alphabetic''</p>
   4.724 -          </div>
   4.725 -        <dt><dfn>''below''</dfn></dt>
   4.726 -        <dd>In horizontal writing modes, the underline is positioned
   4.727 -          relative to the under edge of the element's content box.
   4.728 -          In this case the underline usually does not cross the descenders.
   4.729 -          (This is sometimes called "accounting" underline.)
   4.730 -          If the underline affects descendants with a lower content edge,
   4.731 -          the user agent should shift the underline down further to the
   4.732 -          lowest underlined content box edge.
   4.733 -          The user agent may ignore elements with ''vertical-align''
   4.734 -          values given as lengths, percentages, ''top'', or ''bottom''
   4.735 -          when making this adjustment.
   4.736 -          (Note that images that are not affected by the underline per
   4.737 -          'text-decoration-skip' will not affect the position of the
   4.738 -          underline.)
   4.739 -          <div class="figure">
   4.740 -            <p><img title="text-underline-position: below"
   4.741 -                alt="In a typical Latin font, the underline is far enough
   4.742 -                     below the text that it does not cross the bottom of a 'g'."
   4.743 -                src="underline-position-below.png"
   4.744 -                >
   4.745 -            <p class="caption">''text-underline-position: below''</p>
   4.746 -          </div>
   4.747 -          <div class="example">
   4.748 -            <p>Because 'text-underline-position' inherits, and is not reset
   4.749 -              by the 'text-decoration' shorthand, the following example
   4.750 -              switches the document to use ''below'' underlining, which can
   4.751 -              be more appropriate for writing systems  with long, complicated
   4.752 -              descenders. It is also often useful for mathematical or chemical
   4.753 -              texts that use many subscripts.
   4.754 -            <pre>:root { text-underline-position: below; }</pre>
   4.755 -          </div>
   4.756 -        <dt><dfn>''left''</dfn></dt>
   4.757 -        <dd>In vertical writing modes, the underline is aligned as for
   4.758 -          ''below'', on the left edge of the text.</dd>
   4.759 -        <dt><dfn>''right''</dfn></dt>
   4.760 -        <dd>In vertical writing modes, the underline is aligned as for
   4.761 -          ''below'', except it is aligned to the right edge of the text.
   4.762 -          If this causes the underline to be drawn on the "over" side of
   4.763 -          the text, then an overline also switches sides and is drawn on
   4.764 -          the "under" side.</dd>
   4.765 -      </dl>
   4.766 -
   4.767 -      <p>If ''below'' is specified alone, ''left'' is also implied.
   4.768 -        If ''left'' or ''right'' is specified alone, ''below'' is also
   4.769 -        implied.
   4.770 -
   4.771 -    <p class="issue">
   4.772 -      Should ''above''/''below'' be ''over''/''under'' to match text decoration names?
   4.773 -
   4.774 -      <div class="figure" id="fig-text-underline-position">
   4.775 -        <table>
   4.776 -          <tr>
   4.777 -            <td>
   4.778 -              <img alt="In mixed Japanese-Latin vertical text, 'text-underline-position: left'
   4.779 -                        places the underline on the left side of the text."
   4.780 -                title="text-underline-position: left"
   4.781 -                src="underline-position-left.png"
   4.782 -                >
   4.783 -            </td>
   4.784 -            <td>
   4.785 -              <img alt="In mixed Japanese-Latin vertical text, 'text-underline-position: right'
   4.786 -                        places the underline on the right side of the text."
   4.787 -                title="text-underline-position: right"
   4.788 -                src="underline-position-right.png"
   4.789 -                >
   4.790 -            </td>
   4.791 -          </tr>
   4.792 -          <tr>
   4.793 -            <td>''left''</td>
   4.794 -            <td>''right''</td>
   4.795 -          </tr>
   4.796 -        </table>
   4.797 -        <p class="caption">In vertical writing modes, the 'text-underline-position'
   4.798 -          values ''left'' and ''right'' allow placing the underline on either
   4.799 -          side of the text. (In horizontal writing modes, both values are
   4.800 -          treated as ''below''.)</p>
   4.801 -      </div>
   4.802 -
   4.803 -      <div class="example">
   4.804 -        <p>The following example styles modern Chinese, Japanese, and Korean
   4.805 -          texts with the appropriate underline positions in both horizontal
   4.806 -          and vertical text:
   4.807 -        <pre>:root:lang(ja), [lang|=ja], :root:lang(ko), [lang|=ko] { text-underline-position: below right; }
   4.808 -<!--   -->:root:lang(zh), [lang|=zh] { text-underline-position: below left; }</pre>
   4.809 -      </div>
   4.810 -
   4.811 -      <div class="note">
   4.812 -        <p>In some cases (such as in OpenType) the font format can offer
   4.813 -          information about the appropriate position of an underline.
   4.814 -          Typically this information gives the position of an ''alphabetic''
   4.815 -          underline; in some cases (especially in CJK fonts), it gives
   4.816 -          the position of a ''below left'' underline. (In this case,
   4.817 -          the font's underline metrics typically touch the bottom edge
   4.818 -          of the em box).
   4.819 -          The UA is encouraged to use information (such as the underline
   4.820 -          thickness, or appropriate alphabetic alignment) from the font
   4.821 -          wherever appropriate.
   4.822 -        </p>
   4.823 -      </div>
   4.824 -
   4.825 -  <h3 id="emphasis-marks">
   4.826 -    Emphasis Marks</h3>
   4.827 -
   4.828 -    <p>East Asian documents traditionally use small symbols next to each glyph to emphasize
   4.829 -      a run of text. For example:</p>
   4.830 -
   4.831 -    <div class="figure">
   4.832 -      <p>
   4.833 -        <img alt="Example of emphasis in Japanese appearing above the text"
   4.834 -             class="example" src="text-emphasis-ja.gif" height="28" width="225"></p>
   4.835 -      <p class="caption">Accent emphasis (shown in blue for clarity) applied to Japanese text</p>
   4.836 -    </div>
   4.837 -
   4.838 -    <h4 id="text-emphasis-style">
   4.839 -      Emphasis Mark Style: the 'text-emphasis-style' property</h4>
   4.840 -
   4.841 -    <table class="propdef">
   4.842 -      <tbody>
   4.843 -        <tr>
   4.844 -          <th>Name:</th>
   4.845 -          <td><dfn>text-emphasis-style</dfn></td>
   4.846 -        </tr>
   4.847 -        <tr>
   4.848 -          <th><a href="#values">Value</a>:
   4.849 -          <td>none |
   4.850 -              [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] |
   4.851 -              <a class="noxref" href="http://www.w3.org/TR/CSS21/syndata.html#value-def-string"><span class="value-inst-string">&lt;string&gt;</span></a>
   4.852 -          </td>
   4.853 -        </tr>
   4.854 -        <tr>
   4.855 -          <th>Initial:</th>
   4.856 -          <td>none</td>
   4.857 -        </tr>
   4.858 -        <tr>
   4.859 -          <th>Applies to:</th>
   4.860 -          <td>all elements</td>
   4.861 -        </tr>
   4.862 -        <tr>
   4.863 -          <th>Inherited:</th>
   4.864 -          <td>yes</td>
   4.865 -        </tr>
   4.866 -        <tr>
   4.867 -          <th>Percentages:</th>
   4.868 -          <td>N/A</td>
   4.869 -        </tr>
   4.870 -        <tr>
   4.871 -          <th>Media:</th>
   4.872 -          <td>visual</td>
   4.873 -        </tr>
   4.874 -        <tr>
   4.875 -          <th>Computed&#160;value:</th>
   4.876 -          <td>'none', a pair of keywords representing the shape and fill, or
   4.877 -            a string</td>
   4.878 -        </tr>
   4.879 -      </tbody>
   4.880 -    </table>
   4.881 -
   4.882 -    <p>This property applies emphasis marks to the element's text.
   4.883 -      Values have the following meanings:</p>
   4.884 -
   4.885 -    <dl>
   4.886 -      <dt><dfn title="text-emphasis:none">''none''</dfn></dt>
   4.887 -        <dd>No emphasis marks.</dd>
   4.888 -      <dt><dfn title="text-emphasis:filled">''filled''</dfn></dt>
   4.889 -        <dd>The shape is filled with solid color.</dd>
   4.890 -      <dt><dfn title="text-emphasis:open">''open''</dfn></dt>
   4.891 -        <dd>The shape is hollow.</dd>
   4.892 -      <dt><dfn title="text-emphasis:dot">''dot''</dfn></dt>
   4.893 -        <dd>Display small circles as marks.
   4.894 -          The filled dot is U+2022 '&#x2022;', and the open dot is U+25E6 '&#x25e6;'.</dd>
   4.895 -      <dt><dfn title="text-emphasis:circle">''circle''</dfn></dt>
   4.896 -        <dd>Display large circles as marks.
   4.897 -          The filled circle is U+25CF '&#x25cf;', and the open circle is U+25CB '&#x25cb;'.</dd>
   4.898 -      <dt><dfn title="text-emphasis:double-circle">''double-circle''</dfn></dt>
   4.899 -        <dd>Display double circles as marks.
   4.900 -          The filled double-circle is U+25C9 '&#x25c9;', and the open double-circle is U+25CE '&#x25ce;'.</dd>
   4.901 -      <dt><dfn title="text-emphasis:triangle">''triangle''</dfn></dt>
   4.902 -        <dd>Display triangles as marks.
   4.903 -          The filled triangle is U+25B2 '&#x25b2;', and the open triangle is U+25B3 '&#x25b3;'.</dd>
   4.904 -      <dt><dfn title="text-emphasis:sesame">''sesame''</dfn></dt>
   4.905 -        <dd>Display sesames as marks.
   4.906 -          The filled sesame is U+FE45 '&#xfe45;', and the open sesame is U+FE46 '&#xfe46;'.</dd>
   4.907 -      <dt><dfn title="text-emphasis:sesame">''<var>&lt;string&gt;</var>''</dfn></dt>
   4.908 -        <dd>Display the given string as marks.
   4.909 -          Authors should not specify more than one <i>character</i> in &lt;string&gt;.
   4.910 -          The UA may truncate or ignore strings consisting of more than one grapheme cluster.</dd>
   4.911 -    </dl>
   4.912 -
   4.913 -    <p>If a shape keyword is specified but neither of ''filled'' nor ''open'' is
   4.914 -      specified, ''filled'' is assumed. If only ''filled'' or ''open'' is specified,
   4.915 -      the shape keyword computes to ''circle'' in horizontal writing mode and
   4.916 -      ''sesame'' in vertical writing mode.</p>
   4.917 -
   4.918 -    <p>The marks should be drawn using the element's font settings with its
   4.919 -      size scaled down to 50%. However, not all fonts have all these glyphs,
   4.920 -      and some fonts use inappropriate sizes for emphasis marks in these
   4.921 -      code points. The UA may opt to use a font known to be good for
   4.922 -      emphasis marks, or the marks may instead be synthesized by the UA.
   4.923 -      Marks must remain upright in vertical writing modes: like CJK
   4.924 -      characters, they do not rotate to match the writing mode.</p>
   4.925 -
   4.926 -    <p class="note">
   4.927 -        One example of good fonts for emphasis marks is Adobe's opensource project,
   4.928 -        <a href="http://sourceforge.net/adobe/kenten-generic/">Kenten Generic OpenType Font</a>,
   4.929 -        which is specially designed for the emphasis marks.
   4.930 -    </p>
   4.931 -
   4.932 -    <p>The marks are drawn once for each <i>character</i>. However,
   4.933 -      emphasis marks are not drawn for characters that are:</p>
   4.934 -    <ul>
   4.935 -      <li><a href="#word-separator">Word separators</a> or that
   4.936 -        belong to the Unicode separator classes (Z*).
   4.937 -        (But note that emphasis marks <em>are</em> drawn for a space
   4.938 -         that combines with any combining characters.)</li>
   4.939 -      <li>Characters belonging to the Unicode classes for control codes
   4.940 -        and unassigned characters (Cc, Cf, Cn).</li>
   4.941 -    </ul>
   4.942 -
   4.943 -    <p>If emphasis marks are drawn for characters
   4.944 -      for which ruby is drawn in the same position as the emphasis mark,
   4.945 -      the ruby should be stacked between the emphasis marks and the base text.
   4.946 -      In this case, the position of the emphasis marks for a given element
   4.947 -      should be determined as if all characters have ruby boxes
   4.948 -      of the same height as the highest ruby box in the element.
   4.949 -      If the UA is not capable of drawing ruby and emphasis marks on the same side,
   4.950 -      the UA may hide ruby and draw only emphasis marks.</p>
   4.951 -    <div class="figure">
   4.952 -      <p><img
   4.953 -        alt="Example of emphasis marks applied to 4 characters, and ruby to 2 of them"
   4.954 -        src="text-emphasis-ruby.png" width="134" height="50"></p>
   4.955 -      <p class="caption">Emphasis marks applied to 4 characters, and ruby to 2 of them</p>
   4.956 -    </div>
   4.957 -
   4.958 -    <p class="note">A future level of CSS may define controls to specify
   4.959 -      what to do when emphasis marks and ruby text coincide.</p>
   4.960 -
   4.961 -    <h4 id="text-emphasis-color">
   4.962 -      Emphasis Mark Color: the 'text-emphasis-color' property</h4>
   4.963 -
   4.964 -    <table class="propdef">
   4.965 -      <tbody>
   4.966 -        <tr>
   4.967 -          <th>Name:</th>
   4.968 -          <td><dfn>text-emphasis-color</dfn></td>
   4.969 -        </tr>
   4.970 -        <tr>
   4.971 -          <th><a href="#values">Value</a>:
   4.972 -          <td>&lt;color&gt;</td>
   4.973 -        </tr>
   4.974 -        <tr>
   4.975 -          <th>Initial:</th>
   4.976 -          <td><a href="http://www.w3.org/TR/css3-color/#currentcolor">currentColor</a></td>
   4.977 -        </tr>
   4.978 -        <tr>
   4.979 -          <th>Applies to:</th>
   4.980 -          <td>all elements</td>
   4.981 -        </tr>
   4.982 -        <tr>
   4.983 -          <th>Inherited:</th>
   4.984 -          <td>yes</td>
   4.985 -        </tr>
   4.986 -        <tr>
   4.987 -          <th>Percentages:</th>
   4.988 -          <td>N/A</td>
   4.989 -        </tr>
   4.990 -        <tr>
   4.991 -          <th>Media:</th>
   4.992 -          <td>visual</td>
   4.993 -        </tr>
   4.994 -        <tr>
   4.995 -          <th>Computed&#160;value:</th>
   4.996 -          <td>as specified</td>
   4.997 -        </tr>
   4.998 -      </tbody>
   4.999 -    </table>
  4.1000 -
  4.1001 -    <p>This property specifies the foreground color of the emphasis marks.</p>
  4.1002 -
  4.1003 -    <p class="note">
  4.1004 -      The correct behavior of this property depends on an outstanding erratum on [[CSS3COLOR]]
  4.1005 -      that has the ''currentColor'' keyword inherit as itself,
  4.1006 -      and to take the value of the 'color' property as its <em>used</em> (not computed) value.
  4.1007 -
  4.1008 -    <h4 id="text-emphasis">
  4.1009 -      Emphasis Mark Shorthand: the 'text-emphasis' property</h4>
  4.1010 -
  4.1011 -    <table class="propdef">
  4.1012 -      <tbody>
  4.1013 -        <tr>
  4.1014 -          <th>Name:</th>
  4.1015 -          <td><dfn>text-emphasis</dfn></td>
  4.1016 -        </tr>
  4.1017 -        <tr>
  4.1018 -          <th><a href="#values">Value</a>:
  4.1019 -          <td>'&lt;<a href="#text-emphasis-style">text-emphasis-style</a>&gt;' || '&lt;<a href="#text-emphasis-color">text-emphasis-color</a>&gt;'
  4.1020 -          </td>
  4.1021 -        </tr>
  4.1022 -        <tr>
  4.1023 -          <th>Initial:</th>
  4.1024 -          <td>see individual properties</td>
  4.1025 -        </tr>
  4.1026 -        <tr>
  4.1027 -          <th>Applies to:</th>
  4.1028 -          <td>all elements</td>
  4.1029 -        </tr>
  4.1030 -        <tr>
  4.1031 -          <th>Inherited:</th>
  4.1032 -          <td>yes</td>
  4.1033 -        </tr>
  4.1034 -        <tr>
  4.1035 -          <th>Percentages:</th>
  4.1036 -          <td>N/A</td>
  4.1037 -        </tr>
  4.1038 -        <tr>
  4.1039 -          <th>Media:</th>
  4.1040 -          <td>visual</td>
  4.1041 -        </tr>
  4.1042 -        <tr>
  4.1043 -          <th>Computed&#160;value:</th>
  4.1044 -          <td>see individual properties</td>
  4.1045 -        </tr>
  4.1046 -      </tbody>
  4.1047 -    </table>
  4.1048 -
  4.1049 -    <p>This property is a shorthand for setting
  4.1050 -      'text-emphasis-style' and 'text-emphasis-color'
  4.1051 -      in one declaration.
  4.1052 -      Omitted values are set to their initial values.</p>
  4.1053 -
  4.1054 -    <p class="note">Note that 'text-emphasis-position' is not reset in this
  4.1055 -      shorthand. This is because typically the shape and color vary, but the
  4.1056 -      position is consistent for a particular language throughout the document.
  4.1057 -      Therefore the position should inherit independently.</p>
  4.1058 -
  4.1059 -    <h4 id="text-emphasis-position">
  4.1060 -      Emphasis Mark Position: the 'text-emphasis-position' property</h4>
  4.1061 -
  4.1062 -    <table class="propdef">
  4.1063 -      <tbody>
  4.1064 -        <tr>
  4.1065 -          <th>Name:</th>
  4.1066 -          <td><dfn>text-emphasis-position</dfn></td>
  4.1067 -        </tr>
  4.1068 -        <tr>
  4.1069 -          <th><a href="#values">Value</a>:
  4.1070 -          <td>[ above | below ] && [ right | left ]
  4.1071 -          </td>
  4.1072 -        </tr>
  4.1073 -        <tr>
  4.1074 -          <th>Initial:</th>
  4.1075 -          <td>above right
  4.1076 -        </tr>
  4.1077 -        <tr>
  4.1078 -          <th>Applies to:</th>
  4.1079 -          <td>all elements</td>
  4.1080 -        </tr>
  4.1081 -        <tr>
  4.1082 -          <th>Inherited:</th>
  4.1083 -          <td>yes</td>
  4.1084 -        </tr>
  4.1085 -        <tr>
  4.1086 -          <th>Percentages:</th>
  4.1087 -          <td>N/A</td>
  4.1088 -        </tr>
  4.1089 -        <tr>
  4.1090 -          <th>Media:</th>
  4.1091 -          <td>visual</td>
  4.1092 -        </tr>
  4.1093 -        <tr>
  4.1094 -          <th>Computed&#160;value:</th>
  4.1095 -          <td>as specified</td>
  4.1096 -        </tr>
  4.1097 -      </tbody>
  4.1098 -    </table>
  4.1099 -
  4.1100 -    <p>This property describes where emphasis marks are drawn at.
  4.1101 -      The values have following meanings:</p>
  4.1102 -
  4.1103 -    <dl>
  4.1104 -      <dt><dfn title="text-emphasis:above">''above''</dfn></dt>
  4.1105 -        <dd>Draw marks over the text in horizontal writing mode.</dd>
  4.1106 -      <dt><dfn title="text-emphasis:below">''below''</dfn></dt>
  4.1107 -        <dd>Draw marks under the text in horizontal writing mode.</dd>
  4.1108 -      <dt><dfn title="text-emphasis:right">''right''</dfn></dt>
  4.1109 -        <dd>Draw marks to the right of the text in vertical writing mode.</dd>
  4.1110 -      <dt><dfn title="text-emphasis:left">''left''</dfn></dt>
  4.1111 -        <dd>Draw marks to the left of the text in vertical writing mode.</dd>
  4.1112 -    </dl>
  4.1113 -
  4.1114 -    <p class="issue">
  4.1115 -      Should ''above''/''below'' be ''over''/''under'' to match text decoration names?
  4.1116 -
  4.1117 -    <p>Emphasis marks are drawn exactly as if each character was
  4.1118 -      assigned the mark as its ruby annotation text with the ruby position
  4.1119 -      given by 'text-emphasis-position' and the ruby alignment as centered.
  4.1120 -
  4.1121 -    <p>The effect of emphasis marks on the line height is the same as for
  4.1122 -      ruby text.</p>
  4.1123 -
  4.1124 -    <div class="note">
  4.1125 -      <p>Note, the preferred position of emphasis marks depends on the
  4.1126 -        language. In Japanese for example, the preferred position is
  4.1127 -        ''above right''. In Chinese, on the other hand, the preferred
  4.1128 -        position is ''below right''.
  4.1129 -        The informative table below summarizes the preferred
  4.1130 -        emphasis mark positions for Chinese and Japanese:</p>
  4.1131 -
  4.1132 -      <table class="data">
  4.1133 -        <caption>Preferred emphasis mark and ruby position</caption>
  4.1134 -        <thead>
  4.1135 -          <tr>
  4.1136 -            <th scope="col" rowspan=2>Language</th>
  4.1137 -            <th scope="col" colspan=2>Preferred mark position</th>
  4.1138 -            <th scope="col" colspan=2 rowspan=2>Illustration</th>
  4.1139 -          </tr>
  4.1140 -          <tr>
  4.1141 -            <th>Horizontal</th>
  4.1142 -            <th>Vertical</th>
  4.1143 -        </thead>
  4.1144 -        <tbody>
  4.1145 -          <tr>
  4.1146 -            <td scope="row">Japanese</td>
  4.1147 -            <td>above</td>
  4.1148 -            <td>right</td>
  4.1149 -            <td>
  4.1150 -                <img alt="Emphasis marks appear above each emphasized character in horizontal Japanese text."
  4.1151 -                    title="Emphasis (shown in blue for clarity) applied above a fragment of Japanese text"
  4.1152 -                    src="text-emphasis-ja.gif" height="28" width="225">
  4.1153 -            </td>
  4.1154 -            <td rowspan="2">
  4.1155 -                <img alt="Emphasis marks appear on the right of each emphasized character in vertical Japanese text."
  4.1156 -                    title="Emphasis applied on the right of a fragment of Japanese text"
  4.1157 -                    src="text-emphasis-v.gif" height="89" width="34">
  4.1158 -            </td>
  4.1159 -          </tr>
  4.1160 -          <!--
  4.1161 -          <tr>
  4.1162 -            <td scope="row">Mongolian</td>
  4.1163 -            <td><span class="issue">?</span></td>
  4.1164 -            <td>right</td>
  4.1165 -          </tr>
  4.1166 -          -->
  4.1167 -          <tr>
  4.1168 -            <td scope="row">Chinese</td>
  4.1169 -            <td>below</td>
  4.1170 -            <td>right</td>
  4.1171 -            <td>
  4.1172 -              <img alt="Emphasis marks appear below each emphasized character in horizontal Simplified Chinese text."
  4.1173 -                    title="Emphasis (shown in blue for clarity) applied below a fragment of Chinese text"
  4.1174 -                    src="text-emphasis-zh.gif" height="28" width="133">
  4.1175 -          </tr>
  4.1176 -        </tbody>
  4.1177 -      </table>
  4.1178 -    </div>
  4.1179 -
  4.1180 -  <h3 id="text-shadow">
  4.1181 -    Text Shadows: the 'text-shadow' property</h3>
  4.1182 -
  4.1183 -    <table class="propdef">
  4.1184 -      <tbody>
  4.1185 -        <tr>
  4.1186 -          <th>Name:</th>
  4.1187 -          <td><dfn>text-shadow</dfn></td>
  4.1188 -        </tr>
  4.1189 -        <tr>
  4.1190 -          <th><a href="#values">Value</a>:
  4.1191 -          <td>none | [ &lt;length>{2,3} && &lt;color>? ]#
  4.1192 -        </tr>
  4.1193 -        <tr>
  4.1194 -          <th>Initial:</th>
  4.1195 -          <td>none</td>
  4.1196 -        </tr>
  4.1197 -        <tr>
  4.1198 -          <th>Applies to:</th>
  4.1199 -          <td>all elements</td>
  4.1200 -        </tr>
  4.1201 -        <tr>
  4.1202 -          <th>Inherited:</th>
  4.1203 -          <td>yes</td>
  4.1204 -        </tr>
  4.1205 -        <tr>
  4.1206 -          <th>Percentages:</th>
  4.1207 -          <td>N/A</td>
  4.1208 -        </tr>
  4.1209 -        <tr>
  4.1210 -          <th>Media:</th>
  4.1211 -          <td>visual</td>
  4.1212 -        </tr>
  4.1213 -        <tr>
  4.1214 -          <th>Computed&#160;value:</th>
  4.1215 -          <td>a color plus three absolute &lt;length&gt;s</td>
  4.1216 -        </tr>
  4.1217 -      </tbody>
  4.1218 -    </table>
  4.1219 -
  4.1220 -    <p>This property accepts a comma-separated list of shadow effects to
  4.1221 -      be applied to the text of the element. Values are interpreted as for
  4.1222 -      <a href="http://www.w3.org/TR/css3-background/#the-box-shadow">'box-shadow'</a>
  4.1223 -      [[!CSS3BG]]. (But note that spread values are not allowed.)
  4.1224 -      The shadow is applied to all of the element's text as well as any
  4.1225 -      text decorations it specifies.
  4.1226 -
  4.1227 -    <p>The shadow effects are applied front-to-back: the first shadow is on
  4.1228 -      top. The shadows may thus overlay each other, but they never overlay
  4.1229 -      the text itself. The shadow must be painted at a stack level between
  4.1230 -      the element's border and/or background, if present, and the elements
  4.1231 -      text and text decoration. UAs should avoid painting text shadows over
  4.1232 -      text in adjacent elements belonging to the same stack level and stacking
  4.1233 -      context. (This may mean that the exact stack level of the shadows depends
  4.1234 -      on whether the element has a border or background: the exact stacking
  4.1235 -      behavior of text shadows is thus UA-defined.)</p>
  4.1236 -
  4.1237 -    <p>Unlike 'box-shadow', text shadows are not clipped to the shadowed
  4.1238 -      shape and may show through if the text is partially-transparent.
  4.1239 -      Like 'box-shadow', text shadows do not influence layout, and do not
  4.1240 -      trigger scrolling or increase the size of the scrollable area.
  4.1241 -
  4.1242 -    <p class="note">The painting order of shadows defined here is the opposite
  4.1243 -      of that defined in the 1998
  4.1244 -      <a href="http://www.w3.org/TR/1998/REC-CSS2-19980512">CSS2 Recommendation</a>.</p>
  4.1245 -
  4.1246 -    <p>The ''text-shadow'' property applies to both the
  4.1247 -      <code>::first-line</code> and <code>::first-letter</code>
  4.1248 -      pseudo-elements.</p>
  4.1249 +  <p class="note">
  4.1250 +    <a name="line-decoration"></a>
  4.1251 +    <a name="text-decoration-line"></a>
  4.1252 +    <a name="text-decoration-color"></a>
  4.1253 +    <a name="text-decoration-style"></a>
  4.1254 +    <a name="text-decoration-skip"></a>
  4.1255 +    <a name="text-underline-position"></a>
  4.1256 +    <a name="emphasis-marks"></a>
  4.1257 +    <a name="text-emphasis-style"></a>
  4.1258 +    <a name="text-emphasis-color"></a>
  4.1259 +    <a name="text-emphasis"></a>
  4.1260 +    <a name="text-emphasis-position"></a>
  4.1261 +    <a name="text-shadow"></a>
  4.1262 +    Text decoration has moved to
  4.1263 +    <a href="http://www.w3.org/TR/css3-text-decor/">CSS Text Decoration Module Level 3</a>.
  4.1264 +    [[CSS3TXTDECOR]]
  4.1265  
  4.1266  <h2 id="conformance">
  4.1267  Conformance</h2>
  4.1268 @@ -3541,27 +2542,17 @@
  4.1269  <h2 class="no-num" id="changes">Appendix C:
  4.1270  Changes</h2>
  4.1271    <h3 class="no-num" id="recent-changes">
  4.1272 -  Changes from the <a href="http://www.w3.org/TR/2012/WD-css3-text-20120119/">January
  4.1273 +  Changes from the <a href="http://www.w3.org/TR/2012/WD-css3-text-20120823/">August
  4.1274    2012 CSS3 Text <abbr title="Working Draft">WD</abbr></a></h3>
  4.1275  
  4.1276    <p>Major changes include:</p>
  4.1277    <ul>
  4.1278 -    <li>Removed the ''avoid'' value of 'text-wrap', since it doesn't work
  4.1279 -      very well with the fact that 'text-wrap' inherits.
  4.1280 -    <li>Dropped the 'text-wrap' and 'text-space-collapse',
  4.1281 -      leaving behind only the CSS2.1 'white-space' property.
  4.1282 -    <li>Removed ''text-transform: full-size-kana''.
  4.1283 -    <li>Disallowed combinations of values in 'text-transform'.
  4.1284 +    <li>Shifted text decoration chapter to a separate <a href="http://www.w3.org/TR/css3-text-decor/">Text Decoration module</a>
  4.1285    </ul>
  4.1286  
  4.1287    <p>Significant details updated:</p>
  4.1288    <ul>
  4.1289 -    <li>Defined aliasing of 'word-wrap' and 'overflow-wrap'.
  4.1290 -    <li>Defined interaction of alignment/indentation and ''unicode-bidi: plaintext''.
  4.1291 -    <li>Added ''text-align: match-parent'' to <code>&lt;option></code> elements.
  4.1292 -    <li>Improved terminology and clarified behavior in many instances.
  4.1293 -    <li>Defined that 'text-transform' casing operations only affect letters.
  4.1294 -    <li>Removed concept of "typographic modes".
  4.1295 +    <li>
  4.1296    </ul>
  4.1297  
  4.1298  <h2 class="no-num" id="default-stylesheet">Appendix D: Default UA Stylesheet</h2>
  4.1299 @@ -3895,7 +2886,6 @@
  4.1300        </ol>
  4.1301      <li><a href="#justification">justification</a> (which may affect glyph selection and/or text wrapping, looping back into that step)
  4.1302      <li><a href="#text-align">text alignment</a>
  4.1303 -    <li><a href="#decoration">text decoration</a>
  4.1304    </ol>
  4.1305  
  4.1306  <h2 class="no-num">Appendix H:

css3-text-decor/Overview.html		file \| annotate \| diff \| comparison \| revisions
css3-text-decor/Overview.src.html		file \| annotate \| diff \| comparison \| revisions
css3-text/Overview.html		file \| annotate \| diff \| comparison \| revisions
css3-text/Overview.src.html		file \| annotate \| diff \| comparison \| revisions

Mercurial > drafts / changeset

changeset

[css3-text] Split out Text Decoration into its own module.