8000 [css-text-decor-3] More linking, attempt to improve overline/underlin… · w3c/csswg-drafts@4fa081a · GitHub
Skip to content

Commit 4fa081a

Browse files
fantasaifantasai
committed
[css-text-decor-3] More linking, attempt to improve overline/underline categorization in positioning rules.
1 parent edc179a commit 4fa081a

2 files changed

Lines changed: 97 additions & 79 deletions

File tree

‎css-text-decor-3/Overview.html‎

Lines changed: 80 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,11 @@
1111
<meta content="CSS Text Decoration Module Level 3 (CSS3 Text Decoration)"
1212
name=dcterms.title>
1313
<meta content=text name=dcterms.type>
14-
<meta content=2012-11-13 name=dcterms.issued>
14+
<meta content=2012-12-08 name=dcterms.issued>
1515
<meta content="Elika J. Etemad" name=dcterms.creator>
1616
<meta content="Koji Ishii" name=dcterms.creator>
1717
<meta content=W3C name=dcterms.publisher>
18-
<meta content="http://www.w3.org/TR/2012/WD-css-text-decor-3-20121113/"
18+
<meta content="http://www.w3.org/TR/2012/WD-css-text-decor-3-20121208/"
1919
name=dcterms.identifier>
2020
<link href="#contents" rel=contents><!--<link rel=index href="#index">-->
2121

@@ -30,14 +30,14 @@
3030

3131
<h1>CSS Text Decoration Module Level 3</h1>
3232

33-
<h2 class="no-num no-toc" id=longstatus-date>W3C Working Draft 13 November
33+
<h2 class="no-num no-toc" id=longstatus-date>W3C Working Draft 8 December
3434
2012</h2>
3535

3636
<dl>
3737
<dt>This version:
3838

3939
<dd><a
40-
href="http://www.w3.org/TR/2012/WD-css-text-decor-3-20121113/">http://www.w3.org/TR/2012/WD-css-text-decor-3-20121113/</a></dd>
40+
href="http://www.w3.org/TR/2012/WD-css-text-decor-3-20121208/">http://www.w3.org/TR/2012/WD-css-text-decor-3-20121208/</a></dd>
4141
<!--
4242
<dd><a href="http://dev.w3.org/csswg/css-text-decor-3/">http://dev.w3.org/csswg/css-text-decor-3/</a>
4343
-->
@@ -846,19 +846,21 @@ <h3 id=text-underline-position-property><span class=secno>2.6. </span> Text
846846
Values have the following meanings:
847847

848848
<dl>
849-
<dt><dfn id=auto>‘<code class=css>auto</code>’</dfn>
849+
<dt><dfn id=underline-auto title="text-underline-position: auto">‘<code
850+
class=css>auto</code>’</dfn>
850851

851852
<dd>The user agent may use any algorithm to determine the underline's
852853
position; however it must be placed at or under the alphabetic baseline.
853-
<p class=note>It is suggested that the underline position be ‘<a
854-
href="#alphabetic"><code class=css>alphabetic</code></a>’ unless it
855-
crosses either subscripted (or otherwise lowered) text, or it affects
856-
characters from Asian scripts such as Han or Tibetan, for which an
857-
alphabetic underline is too high: in such cases, aligning to the em box
858-
edge as described for ‘<code class=css>under left</code>’ is more
859-
appropriate.
854+
<p class=note>It is suggested that the underline position be ‘<code
855+
class=css>alphabetic</code>’ unless it crosses either subscripted (or
856+
otherwise lowered) text, or it affects characters from Asian scripts
857+
such as Han or Tibetan, for which an alphabetic underline is too high:
858+
in such cases, aligning to the em box edge as described for ‘<code
859+
class=css>under left</code>’ is more appropriate.
860860

861-
<dt><dfn id=alphabetic>‘<code class=css>alphabetic</code>’</dfn>
861+
<dt><dfn id=underline-alphabetic
862+
title="text-underline-position: alphabetic">‘<code
863+
class=css>alphabetic</code>’</dfn>
862864

863865
<dd>The underline is positioned relative to the alphabetic baseline. In
864866
this case the underline is likely to cross some descenders.
@@ -868,11 +870,13 @@ <h3 id=text-underline-position-property><span class=secno>2.6. </span> Text
868870
src=underline-position-alphabetic.png
869871
title="text-underline-position: alphabetic">
870872

871-
<p class=caption>‘<code class=css>text-underline-position:
872-
alphabetic</code>’
873+
<p class=caption>‘<a href="#underline-alphabetic"><code
874+
class=css>text-underline-position: alphabetic</code></a>’
873875
</div>
874876

875-
<dt><dfn id=under>‘<code class=css>under</code>’</dfn>
877+
<dt><dfn id=underline-under
878+
title="text-underline-position: under">‘<code
879+
class=css>under</code>’</dfn>
876880

877881
<dd>In horizontal writing modes, the underline is positioned relative to
878882
the under edge of the element's content box. In this case the underline
@@ -893,46 +897,47 @@ <h3 id=text-underline-position-property><span class=secno>2.6. </span> Text
893897
src=underline-position-under.png
894898
title="text-underline-position: under">
895899

896-
<p class=caption>‘<code class=css>text-underline-position:
897-
under</code>’
900+
<p class=caption>‘<a href="#underline-under"><code
901+
class=css>text-underline-position: under</code></a>’
898902
</div>
899903

900904
<div class=example>
901905
<p>Because ‘<a href="#text-underline-position"><code
902906
class=property>text-underline-position</code></a>’ inherits, and is
903907
not reset by the ‘<a href="#text-decoration"><code
904908
class=property>text-decoration</code></a>’ shorthand, the following
905-
example switches the document to use ‘<a href="#under"><code
906-
class=css>under</code></a>’ underlining, which can be more
907-
appropriate for writing systems with long, complicated descenders. It
908-
is also often useful for mathematical or chemical texts that use many
909-
subscripts.
909+
example switches the document to use ‘<code class=css>under</code>’
910+
underlining, which can be more appropriate for writing systems with
911+
long, complicated descenders. It is also often useful for mathematical
912+
or chemical texts that use many subscripts.
910913

911914
<pre>:root { text-underline-position: under; }</pre>
912915
</div>
913916

914-
<dt><dfn id=left>‘<code class=css>left</code>’</dfn>
917+
<dt><dfn id=underline-left title="text-underline-position: left">‘<code
918+
class=css>left</code>’</dfn>
915919

916-
<dd>In vertical writing modes, the underline is aligned as for ‘<a
917-
href="#under"><code class=css>under</code></a>’, except it is always
918-
aligned to the left edge of the text. If this causes the underline to be
919-
drawn on the "over" side of the text, then an overline also switches
920-
sides and is drawn on the "under" side.
920+
<dd>In vertical writing modes, the underline is aligned as for ‘<code
921+
class=css>under</code>’, except it is always aligned to the left edge
922+
of the text. If this causes the underline to be drawn on the "over" side
923+
of the text, then an overline also switches sides and is drawn on the
924+
"under" side.
921925

922-
<dt><dfn id=right>‘<code class=css>right</code>’</dfn>
926+
<dt><dfn id=underline-right
927+
title="text-underline-position: right">‘<code
928+
class=css>right</code>’</dfn>
923929

924-
<dd>In vertical writing modes, the underline is aligned as for ‘<a
925-
href="#under"><code class=css>under</code></a>’, except it is always
926-
aligned to the right edge of the text. If this causes the underline to be
927-
drawn on the "over" side of the text, then an overline also switches
928-
sides and is drawn on the "under" side.
930+
<dd>In vertical writing modes, the underline is aligned as for ‘<code
931+
class=css>under</code>’, except it is always aligned to the right edge
932+
of the text. If this causes the underline to be drawn on the "over" side
933+
of the text, then an overline also switches sides and is drawn on the
934+
"under" side.
929935
</dl>
930936

931-
<p>If ‘<a href="#under"><code class=css>under</code></a>’ is specified
932-
alone, ‘<a href="#left"><code class=css>left</code></a>’ is also
933-
implied. If ‘<a href="#left"><code class=css>left</code></a>’ or ‘<a
934-
href="#right"><code class=css>right</code></a>’ is specified alone,
935-
‘<a href="#under"><code class=css>under</code></a>’ is also implied.
937+
<p>If ‘<code class=css>under</code>’ is specified alone, ‘<code
938+
class=css>left</code>’ is also implied. If ‘<code
939+
class=css>left</code>’ or ‘<code class=css>right</code>’ is
940+
specified alone, ‘<code class=css>under</code>’ is also implied.
936941

937942
<div class=figure id=fig-text-underline-position>
938943
<table>
@@ -948,19 +953,17 @@ <h3 id=text-underline-position-property><span class=secno>2.6. </span> Text
948953
title="text-underline-position: right">
949954

950955
<tr>
951-
<td>‘<a href="#left"><code class=css>left</code></a>’
956+
<td>‘<code class=css>left</code>’
952957

953-
<td>‘<a href="#right"><code class=css>right</code></a>’
958+
<td>‘<code class=css>right</code>’
954959
</table>
955960

956961
<p class=caption>In vertical writing modes, the ‘<a
957962
href="#text-underline-position"><code
958-
class=property>text-underline-position</code></a>’ values ‘<a
959-
href="#left"><code class=css>left</code></a>’ and ‘<a
960-
href="#right"><code class=css>right</code></a>’ allow placing the
961-
underline on either side of the text. (In horizontal writing modes, both
962-
values are treated as ‘<a href="#under"><code
963-
class=css>under</code></a>’.)
963+
class=property>text-underline-position</code></a>’ values ‘<code
964+
class=css>left</code>’ and ‘<code class=css>right</code>’ allow
965+
placing the underline on either side of the text. (In horizontal writing
966+
modes, both values are treated as ‘<code class=css>under</code>’.)
964967
</div>
965968

966969
<div class=example>
@@ -978,15 +981,22 @@ <h3 id=line-position><span class=secno>2.7. </span> Determining the
978981
<p>In determining the position of text decoration lines, user agents must
979982
consider, per line box, the "ideal" positions of all fragments of in-flow
980983
inline descendants of the <a href="#decorating-box"><i>decorating
981-
box</i></a> on that line as follows:
984+
box</i></a> on that line as follows (treating <a
985+
href="#underline-left"><i>over</i>-positioned underlines</a> as
986+
<i>over</i> lines and <a href="#underline-left"><i>under</i>-positioned
987+
overlines</a> as <i>under</i> lines):
982988

983989
<dl>
984-
<dt>overlines (and <i>over</i>-positioned underlines)
990+
<dt><a
991+
href="http://dev.w3.org/csswg/css3-writing-modes/#over"><i>over</i></a>
992+
lines
985993

986994
<dd> Align the line decoration with respect to the highest
987-
<i>text-over</i> edge of the considered fragments.
995+
<!-- <i>text-over</i> baseline of the considered fragments. --> <a
996+
href="http://dev.w3.org/csswg/css3-writing-modes/#over"><i>over</i></a>
997+
edge of the considered fragments' EM boxes.
988998

989-
<dt><a href="#alphabetic"><i>alphabetic</i></a> underlines
999+
<dt><a href="#underline-alphabetic"><i>alphabetic</i></a> underlines
9901000

9911001
<dd> Calculate an average of the ideal underlining offsets (from their
9921002
respective alphabetic baselines) of the considered fragments, assigning
@@ -997,11 +1007,14 @@ <h3 id=line-position><span class=secno>2.7. </span> Determining the
9971007
‘<code class=css>baseline</code>’-aligned boxes if the dominant
9981008
baseline is non-alphabetic.)
9991009

1000-
<dt>non-alphabetic underlines (and <a
1001-
href="#under"><i>under</i></a>-positioned overlines)
1010+
<dt>non-alphabetic <a
1011+
href="http://dev.w3.org/csswg/css3-writing-modes/#under"><i>under</i></a>
1012+
lines
10021013

10031014
<dd> Position the line decoration with respect to the lowest
1004-
<i>text-under</i> edge of the considered fragments.
1015+
<!-- <i>text-under</i> baseline of the considered fragments. --> <a
1016+
href="http://dev.w3.org/csswg/css3-writing-modes/#under"><i>under</i></a>
1017+
edge of the considered fragments' EM boxes.
10051018

10061019
<dt>line-throughs
10071020

@@ -1037,9 +1050,9 @@ <h3 id=line-position><span class=secno>2.7. </span> Determining the
10371050
<div class=note>
10381051
<p>In some cases (such as in OpenType) the font format can offer
10391052
information about the appropriate position of an underline. Typically
1040-
this information gives the position of an ‘<a href="#alphabetic"><code
1041-
class=css>alphabetic</code></a>’ underline; in some cases (especially
1042-
in CJK fonts), it gives the position of a ‘<code class=css>under
1053+
this information gives the position of an ‘<code
1054+
class=css>alphabetic</code>’ underline; in some cases (especially in
1055+
CJK fonts), it gives the position of a ‘<code class=css>under
10431056
left</code>’ underline. (In this case, the font's underline metrics
10441057
typically touch the bottom edge of the em box). The UA is encouraged to
10451058
use information (such as the underline thickness, or appropriate
@@ -1405,17 +1418,17 @@ <h3 id=text-emphasis-position-property><span class=secno>3.4. </span>
14051418

14061419
<dd>Draw marks over the text in horizontal writing mode.
14071420

1408-
<dt><dfn id=under0 title="text-emphasis:under">‘<code
1421+
<dt><dfn id=under title="text-emphasis:under">‘<code
14091422
class=css>under</code>’</dfn>
14101423

14111424
<dd>Draw marks under the text in horizontal writing mode.
14121425

1413-
<dt><dfn id=right0 title="text-emphasis:right">‘<code
1426+
<dt><dfn id=right title="text-emphasis:right">‘<code
14141427
class=css>right</code>’</dfn>
14151428

14161429
<dd>Draw marks to the right of the text in vertical writing mode.
14171430

1418-
<dt><dfn id=left0 title="text-emphasis:left">‘<code
1431+
<dt><dfn id=left title="text-emphasis:left">‘<code
14191432
class=css>left</code>’</dfn>
14201433

14211434
<dd>Draw marks to the left of the text in vertical writing mode.
@@ -1780,10 +1793,10 @@ <h3 class=no-num id=normative-ref>Normative references</h3>
17801793
<dt id=CSS3-WRITING-MODES>[CSS3-WRITING-MODES]
17811794

17821795
<dd>Elika J. Etemad; Koji Ishii. <a
1783-
href="http://www.w3.org/TR/2012/WD-css3-writing-modes-20120501/"><cite>CSS
1784-
Writing Modes Module Level 3.</cite></a> 1 May 2012. W3C Working Draft.
1785-
(Work in progress.) URL: <a
1786-
href="http://www.w3.org/TR/2012/WD-css3-writing-modes-20120501/">http://www.w3.org/TR/2012/WD-css3-writing-modes-20120501/</a>
1796+
href="http://www.w3.org/TR/2012/WD-css3-writing-modes-20121115/"><cite>CSS
1797+
Writing Modes Module Level 3.</cite></a> 15 November 2012. W3C Working
1798+
Draft. (Work in progress.) URL: <a
1799+
href="http://www.w3.org/TR/2012/WD-css3-writing-modes-20121115/">http://www.w3.org/TR/2012/WD-css3-writing-modes-20121115/</a>
17871800
</dd>
17881801
<!---->
17891802

@@ -1871,9 +1884,8 @@ <h3 class=no-num id=recent-changes> Changes since the <a
18711884
class=property>text-emphasis-position</code></a>’ and ‘<a
18721885
href="#text-underline-position"><code
18731886
class=property>text-underline-position</code></a>’ to ‘<code
1874-
class=css>over</code>’ and ‘<a href="#under"><code
1875-
class=css>under</code></a>’ to match terminology in ‘<a
1876-
href="#text-decoration-line"><code
1887+
class=css>over</code>’ and ‘<code class=css>under</code>’ to match
1888+
terminology in ‘<a href="#text-decoration-line"><code
18771889
class=property>text-decoration-line</code></a>’.
18781890

18791891
<li>Define interaction of ‘<a href="#text-shadow"><code

‎css-text-decor-3/Overview.src.html‎

Lines changed: 17 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -529,7 +529,7 @@ <h3 id="text-underline-position-property">
529529
ancestor elements. Values have the following meanings:</p>
530530

531531
<dl>
532-
<dt><dfn>''auto''</dfn></dt>
532+
<dt><dfn id="underline-auto" title="text-underline-position: auto">''auto''</dfn></dt>
533533
<dd>The user agent may use any algorithm to determine the
534534
underline's position; however it must be placed at or under
535535
the alphabetic baseline.
@@ -539,7 +539,7 @@ <h3 id="text-underline-position-property">
539539
scripts such as Han or Tibetan, for which an alphabetic
540540
underline is too high: in such cases, aligning to the em box
541541
edge as described for ''under left'' is more appropriate.
542-
<dt><dfn>''alphabetic''</dfn></dt>
542+
<dt><dfn id="underline-alphabetic" title="text-underline-position: alphabetic">''alphabetic''</dfn></dt>
543543
<dd>The underline is positioned relative to the alphabetic baseline. In
544544
this case the underline is likely to cross some descenders.
545545
<div class="figure">
@@ -552,7 +552,7 @@ <h3 id="text-underline-position-property">
552552
>
553553
<p class="caption">''text-underline-position: alphabetic''</p>
554554
</div>
555-
<dt><dfn>''under''</dfn></dt>
555+
<dt><dfn id="underline-under" title="text-underline-position: under">''under''</dfn></dt>
556556
<dd>In horizontal writing modes, the underline is positioned
557557
relative to the under edge of the element's content box.
558558
In this case the underline usually does not cross the descenders.
@@ -583,13 +583,13 @@ <h3 id="text-underline-position-property">
583583
texts that use many subscripts.
584584
<pre>:root { text-underline-position: under; }</pre>
585585
</div>
586-
<dt><dfn>''left''</dfn></dt>
586+
<dt><dfn id="underline-left" title="text-underline-position: left">''left''</dfn></dt>
587587
<dd>In vertical writing modes, the underline is aligned as for
588588
''under'', except it is always aligned to the left edge of the text.
589589
If this causes the underline to be drawn on the "over" side of
590590
the text, then an overline also switches sides and is drawn on
591591
the "under" side.
592-
<dt><dfn>''right''</dfn></dt>
592+
<dt><dfn id="underline-right" title="text-underline-position: right">''right''</dfn></dt>
593593
<dd>In vertical writing modes, the underline is aligned as for
594594
''under'', except it is always aligned to the right edge of the text.
595595
If this causes the underline to be drawn on the "over" side of
@@ -642,15 +642,19 @@ <h3 id="line-position">
642642
<p>In determining the position of text decoration lines,
643643
user agents must consider, per line box, the "ideal" positions of all fragments
644644
of in-flow inline descendants of the <i>decorating box</i> on that line
645-
as follows:
645+
as follows
646+
(treating <a href="#underline-left"><i>over</i>-positioned underlines</a> as <i>over</i> lines
647+
and <a href="#underline-left"><i>under</i>-positioned overlines</a> as <i>under</i> lines):
646648

647649
<dl>
648-
<dt>overlines (and <i>over</i>-positioned underlines)
650+
<dt><a href="http://dev.w3.org/csswg/css3-writing-modes/#over"><i>over</i></a> lines
649651
<dd>
650652
Align the line decoration with respect to the highest
651-
<i>text-over</i> edge of the considered fragments.
653+
<!-- <i>text-over</i> baseline of the considered fragments. -->
654+
<a href="http://dev.w3.org/csswg/css3-writing-modes/#over"><i>over</i></a> edge
655+
of the considered fragments' EM boxes.
652656

653-
<dt><i>alphabetic</i> underlines
657+
<dt><a href="#underline-alphabetic"><i>alphabetic</i></a> underlines
654658
<dd>
655659
Calculate an average of the ideal underlining offsets
656660
(from their respective alphabetic baselines)
@@ -660,10 +664,12 @@ <h3 id="line-position">
660664
with that calculated offset.
661665
(Alphabetic baselines can differ between ''baseline''-aligned boxes if the dominant baseline is non-alphabetic.)
662666

663-
<dt>non-alphabetic underlines (and <i>under</i>-positioned overlines)
667+
<dt>non-alphabetic <a href="http://dev.w3.org/csswg/css3-writing-modes/#under"><i>under</i></a> lines
664668
<dd>
665669
Position the line decoration with respect to the lowest
666-
<i>text-under</i> edge of the considered fragments.
670+
<!-- <i>text-under</i> baseline of the considered fragments. -->
671+
<a href="http://dev.w3.org/csswg/css3-writing-modes/#under"><i>under</i></a> edge
672+
of the considered fragments' EM boxes.
667673

668674
<dt>line-throughs
669675
<dd>

0 commit comments

Comments
 (0)