Skip to content

Commit 7eac046

Browse files
tabatkinstabatkins
committed
[css-counter-styles] Editorial tweak of the predefined styles to give them all descriptions and examples first.
1 parent d81e29d commit 7eac046

File tree

2 files changed

+263
-117
lines changed

2 files changed

+263
-117
lines changed

‎css-counter-styles/Overview.html

+135-71
Original file line numberDiff line numberDiff line change
@@ -1398,68 +1398,106 @@ <h3 id=simple-numeric><span class=secno>5.1. </span> Numeric: ‘<a
13981398
href="#georgian"><code class=css>georgian</code></a>’, ‘<a
13991399
href="#hebrew"><code class=css>hebrew</code></a>’</h3>
14001400

1401+
<dl>
1402+
<dt><dfn id=decimal>‘<code class=css>decimal</code>’</dfn>
1403+
1404+
<dd> Western decimal numbers (e.g., 1, 2, 3, ..., 98, 99, 100).
1405+
1406+
<dt><dfn id=decimal-leading-zero>‘<code
1407+
class=css>decimal-leading-zero</code>’</dfn>
1408+
1409+
<dd> Decimal numbers padded by initial zeros (e.g., 01, 02, 03, ..., 98,
1410+
99, 100).
1411+
1412+
<dt><dfn id=cjk-decimal>‘<code class=css>cjk-decimal</code>’</dfn>
1413+
1414+
<dd> Han decimal numbers (e.g., 一, 二, 三, ..., 九八, 九九,
1415+
一〇〇).
1416+
1417+
<dt><dfn id=lower-roman>‘<code class=css>lower-roman</code>’</dfn>
1418+
1419+
<dd> Lowercase ASCII Roman numerals (e.g., i, ii, iii, ..., xcviii, xcix,
1420+
c).
1421+
1422+
<dt><dfn id=upper-roman>‘<code class=css>upper-roman</code>’</dfn>
1423+
1424+
<dd> Uppercase ASCII Roman numerals (e.g., I, II, III, ..., XCVIII, XCIX,
1425+
C).
1426+
1427+
<dt><dfn id=armenian>‘<code class=css>armenian</code>’</dfn>
1428+
1429+
<dd> Traditional uppercase Armenian numbering (e.g., Ա, Բ, Գ, ...,
1430+
ՂԸ, ՂԹ, Ճ).
1431+
1432+
<dt><dfn id=georgian>‘<code class=css>georgian</code>’</dfn>
1433+
1434+
<dd> Traditional Georgian numbering (e.g., ა, ბ, გ, ..., ჟჱ,
1435+
ჟთ, რ).
1436+
1437+
<dt><dfn id=hebrew>‘<code class=css>hebrew</code>’</dfn>
1438+
1439+
<dd> Traditional Hebrew numbering (e.g., א‎, ב‎, ג‎, ...,
1440+
צח‎, צט‎, ק‎).
1441+
</dl>
1442+
1443+
<p> The ‘<a href="#decimal"><code class=css>decimal</code></a>’
1444+
counter-style must not be overridable with a @counter-style rule, so that
1445+
it is always available as an ultimate fallback style.
1446+
1447+
<p> The following stylesheet fragment provides the normative definition of
1448+
these predefined counter styles:
1449+
14011450
<pre class=stylesheet><bdo>
1402-
@counter-style <dfn id=decimal>decimal</dfn> {
1451+
@counter-style decimal {
14031452
type: numeric;
14041453
symbols: '0' '1' '2' '3' '4' '5' '6' '7' '8' '9';
14051454
}
14061455

1407-
@counter-style <dfn
1408-
id=decimal-leading-zero>decimal-leading-zero</dfn> {
1456+
@counter-style decimal-leading-zero {
14091457
type: fixed -9;
14101458
symbols: '-09' '-08' '-07' '-06' '-05' '-04' '-03' '-02' '-01' '00' '01' '02' '03' '04' '05' '06' '07' '08' '09';
14111459
}
14121460

1413-
@counter-style <dfn
1414-
id=cjk-decimal>cjk-decimal</dfn> {
1461+
@counter-style cjk-decimal {
14151462
type: numeric;
14161463
symbols: \3007 \4E00 \4E8C \4E09 \56DB \4E94 \516D \4E03 \516B \4E5D;
14171464
/* 〇 一 二 三 四 五 六 七 八 九 */
14181465
}
14191466

1420-
@counter-style <dfn
1421-
id=lower-roman>lower-roman</dfn> {
1467+
@counter-style lower-roman {
14221468
type: additive;
14231469
range: 1 4999;
14241470
additive-symbols: 1000 m, 900 cm, 500 d, 400 cd, 100 c, 90 xc, 50 l, 40 xl, 10 x, 9 ix, 5 v, 4 iv, 1 i;
14251471
}
14261472

1427-
@counter-style <dfn
1428-
id=upper-roman>upper-roman</dfn> {
1473+
@counter-style upper-roman {
14291474
type: additive;
14301475
range: 1 4999;
14311476
additive-symbols: 1000 M, 900 CM, 500 D, 400 CD, 100 C, 90 XC, 50 L, 40 XL, 10 X, 9 IX, 5 V, 4 IV, 1 I;
14321477
}
14331478

1434-
@counter-style <dfn
1435-
id=armenian>armenian</dfn> {
1479+
@counter-style armenian {
14361480
type: additive;
14371481
range: 1 9999;
14381482
additive-symbols: 9000 \554, 8000 \553, 7000 \552, 6000 \551, 5000 \550, 4000 \54F, 3000 \54E, 2000 \54D, 1000 \54C, 900 \54B, 800 \54A, 700 \549, 600 \548, 500 \547, 400 \546, 300 \545, 200 \544, 100 \543, 90 \542, 80 \541, 70 \540, 60 \53F, 50 \53E, 40 \53D, 30 \53C, 20 \53B, 10 \53A, 9 \539, 8 \538, 7 \537, 6 \536, 5 \535, 4 \534, 3 \533, 2 \532, 1 \531;
14391483
/* 9000 Ք, 8000 Փ, 7000 Ւ, 6000 Ց, 5000 Ր, 4000 Տ, 3000 Վ, 2000 Ս, 1000 Ռ, 900 Ջ, 800 Պ, 700 Չ, 600 Ո, 500 Շ, 400 Ն, 300 Յ, 200 Մ, 100 Ճ, 90 Ղ, 80 Ձ, 70 Հ, 60 Կ, 50 Ծ, 40 Խ, 30 Լ, 20 Ի, 10 Ժ, 9 Թ, 8 Ը, 7 Է, 6 Զ, 5 Ե, 4 Դ, 3 Գ, 2 Բ, 1 Ա */
14401484
}
14411485

1442-
@counter-style <dfn
1443-
id=georgian>georgian</dfn> {
1486+
@counter-style georgian {
14441487
type: additive;
14451488
range: 1 19999;
14461489
additive-symbols: 10000 \10F5, 9000 \10F0, 8000 \10EF, 7000 \10F4, 6000 \10EE, 5000 \10ED, 4000 \10EC, 3000 \10EB, 2000 \10EA, 1000 \10E9, 900 \10E8, 800 \10E7, 700 \10E6, 600 \10E5, 500 \10E4, 400 \10F3, 300 \10E2, 200 \10E1, 100 \10E0, 90 \10DF, 80 \10DE, 70 \10DD, 60 \10F2, 50 \10DC, 40 \10DB, 30 \10DA, 20 \10D9, 10 \10D8, 9 \10D7, 8 \10F1, 7 \10D6, 6 \10D5, 5 \10D4, 4 \10D3, 3 \10D2, 2 \10D1, 1 \10D0;
14471490
/* 10000 ჵ, 9000 ჰ, 8000 ჯ, 7000 ჴ, 6000 ხ, 5000 ჭ, 4000 წ, 3000 ძ, 2000 ც, 1000 ჩ, 900 შ, 800 ყ, 700 ღ, 600 ქ, 500 ფ, 400 ჳ, 300 ტ, 200 ს, 100 რ, 90 ჟ, 80 პ, 70 ო, 60 ჲ, 50 ნ, 40 მ, 30 ლ, 20 კ, 10 ი, 9 თ, 8 ჱ, 7 ზ, 6 ვ, 5 ე, 4 დ, 3 გ, 2 ბ, 1 ა */
14481491
}
14491492

1450-
@counter-style <dfn
1451-
id=hebrew>hebrew</dfn> {
1493+
@counter-style hebrew {
14521494
type: additive;
14531495
range: 1 infinite;
14541496
additive-symbols: 400 \5EA, 300 \5E9, 200 \5E8, 100 \5E7, 90 \5E6, 80 \5E4, 70 \5E2, 60 \5E1, 50 \5E0, 40 \5DE, 30 \5DC, 20 \5DB, 19 \5D9\5D8, 18 \5D9\5D7, 17 \5D9\5D6, 16 \5D8\5D6, 15 \5D8\5D5, 10 \5D9, 9 \5D8, 8 \5D7, 7 \5D6, 6 \5D5, 5 \5D4, 4 \5D3, 3 \5D2, 2 \5D1, 1 \5D0;
14551497
/* 400 ת, 300 ש, 200 ר, 100 ק, 90 צ, 80 פ, 70 ע, 60 ס, 50 נ, 40 מ, 30 ל, 20 כ, 19 יט, 18 יח, 17 יז, 16 טז, 15 טו, 10 י, 9 ט, 8 ח, 7 ז, 6 ו, 5 ה, 4 ד, 3 ג, 2 ב, 1 א */
14561498
/* This system manually specifies the values for 19-15 to force the correct display of 15 and 16, which are commonly rewritten to avoid a close resemblance to the Tetragrammaton. */
14571499
}</bdo></pre>
14581500

1459-
<p> The ‘<a href="#decimal"><code class=css>decimal</code></a>’
1460-
counter-style must not be overridable with a @counter-style rule, so that
1461-
it is always available as an ultimate fallback style.
1462-
14631501
<h3 id=simple-alphabetic><span class=secno>5.2. </span> Alphabetic: ‘<a
14641502
href="#lower-alpha"><code class=css>lower-alpha</code></a>’, ‘<a
14651503
href="#lower-latin"><code class=css>lower-latin</code></a>’, ‘<a
@@ -1471,62 +1509,96 @@ <h3 id=simple-alphabetic><span class=secno>5.2. </span> Alphabetic: ‘<a
14711509
href="#katakana"><code class=css>katakana</code></a>’, ‘<a
14721510
href="#katakana-iroha"><code class=css>katakana-iroha</code></a>’</h3>
14731511

1512+
<dl>
1513+
<dt><dfn id=lower-alpha>‘<code class=css>lower-alpha</code>’</dfn>
1514+
1515+
<dt><dfn id=lower-latin>‘<code class=css>lower-latin</code>’</dfn>
1516+
1517+
<dd> Lowercase ASCII letters (e.g., a, b, c, ..., z, aa, ab).
1518+
1519+
<dt><dfn id=upper-alpha>‘<code class=css>upper-alpha</code>’</dfn>
1520+
1521+
<dt><dfn id=upper-latin>‘<code class=css>upper-latin</code>’</dfn>
1522+
1523+
<dd> Uppercase ASCII letters (e.g., A, B, C, ..., Z, AA, AB).
1524+
1525+
<dt><dfn id=lower-greek>‘<code class=css>lower-greek</code>’</dfn>
1526+
1527+
<dd> Lowercase classical Greek (e.g., α, β, γ, ..., ω, αα, αβ).
1528+
1529+
<dt><dfn id=hiragana>‘<code class=css>hiragana</code>’</dfn>
1530+
1531+
<dd> Dictionary-order hiragana lettering (e.g., あ, い, う, ..., ん,
1532+
ああ, あい).
1533+
1534+
<dt><dfn id=hiragana-iroha>‘<code
1535+
class=css>hiragana-iroha</code>’</dfn>
1536+
1537+
<dd> Iroha-order hiragana lettering (e.g., い, ろ, は, ..., ん,
1538+
いい, いろ).
1539+
1540+
<dt><dfn id=katakana>‘<code class=css>katakana</code>’</dfn>
1541+
1542+
<dd> Dictionary-order katakana lettering (e.g., ア, イ, ウ, ..., ン,
1543+
アア, アイ).
1544+
1545+
<dt><dfn id=katakana-iroha>‘<code
1546+
class=css>katakana-iroha</code>’</dfn>
1547+
1548+
<dd> Iroha-order katakana lettering (e.g., イ, ロ, ハ, ..., ン,
1549+
イイ, イロ)
1550+
</dl>
1551+
1552+
<p> The following stylesheet fragment provides the normative definition of
1553+
these predefined counter styles:
1554+
14741555
<pre class=stylesheet><bdo>
1475-
@counter-style <dfn
1476-
id=lower-alpha>lower-alpha</dfn> {
1556+
@counter-style lower-alpha {
14771557
type: alphabetic;
14781558
symbols: a b c d e f g h i j k l m n o p q r s t u v w x y z;
14791559
}
14801560

1481-
@counter-style <dfn
1482-
id=lower-latin>lower-latin</dfn> {
1561+
@counter-style lower-latin {
14831562
type: override lower-alpha;
14841563
}
14851564

1486-
@counter-style <dfn
1487-
id=upper-alpha>upper-alpha</dfn> {
1565+
@counter-style upper-alpha {
14881566
type: alphabetic;
14891567
symbols: A B C D E F G H I J K L M N O P Q R S T U V W X Y Z;
14901568
}
14911569

1492-
@counter-style <dfn
1493-
id=upper-latin>upper-latin</dfn> {
1570+
@counter-style upper-latin {
14941571
type: override upper-alpha;
14951572
}
14961573

1497-
@counter-style <dfn
1498-
id=lower-greek>lower-greek</dfn> {
1574+
@counter-style lower-greek {
14991575
type: alphabetic;
15001576
symbols: \3B1 \3B2 \3B3 \3B4 \3B5 \3B6 \3B7 \3B8 \3B9 \3BA \3BB \3BC \3BD \3BE \3BF \3C0 \3C1 \3C3 \3C4 \3C5 \3C6 \3C7 \3C8 \3C9;
15011577
/* α β γ δ ε ζ η θ ι κ λ μ ν ξ ο π ρ σ τ υ φ χ ψ ω */
15021578
}
15031579

1504-
@counter-style <dfn
1505-
id=hiragana>hiragana</dfn> {
1580+
@counter-style hiragana {
15061581
type: alphabetic;
15071582
symbols: \3042 \3044 \3046 \3048 \304A \304B \304D \304F \3051 \3053 \3055 \3057 \3059 \305B \305D \305F \3061 \3064 \3066 \3068 \306A \306B \306C \306D \306E \306F \3072 \3075 \3078 \307B \307E \307F \3080 \3081 \3082 \3084 \3086 \3088 \3089 \308A \308B \308C \308D \308F \3092 \3093;
15081583
/* あ い う え お か き く け こ さ し す せ そ た ち つ て と な に ぬ ね の は ひ ふ へ ほ ま み む め も や ゆ よ ら り る れ ろ わ を ん */
1509-
suffix: 、;
1584+
suffix: '、';
15101585
}
15111586

1512-
@counter-style <dfn
1513-
id=hiragana-iroha>hiragana-iroha</dfn> {
1587+
@counter-style hiragana-iroha {
15141588
type: alphabetic;
15151589
symbols: \3044 \308D \306F \306B \307B \3078 \3068 \3061 \308A \306C \308B \3092 \308F \304B \3088 \305F \308C \305D \3064 \306D \306A \3089 \3080 \3046 \3090 \306E \304A \304F \3084 \307E \3051 \3075 \3053 \3048 \3066 \3042 \3055 \304D \3086 \3081 \307F \3057 \3091 \3072 \3082 \305B \3059 \3093;
15161590
/* い ろ は に ほ へ と ち り ぬ る を わ か よ た れ そ つ ね な ら む う ゐ の お く や ま け ふ こ え て あ さ き ゆ め み し ゑ ひ も せ す ん */
1517-
suffix: 、;
1591+
suffix: '、';
15181592
}
15191593

1520-
@counter-style <dfn
1521-
id=katakana>katakana</dfn> {
1594+
@counter-style katakana {
15221595
type: alphabetic;
15231596
symbols: \30A2 \30A4 \30A6 \30A8 \30AA \30AB \30AD \30AF \30B1 \30B3 \30B5 \30B7 \30B9 \30BB \30BD \30BF \30C1 \30C4 \30C6 \30C8 \30CA \30CB \30CC \30CD \30CE \30CF \30D2 \30D5 \30D8 \30DB \30DE \30DF \30E0 \30E1 \30E2 \30E4 \30E6 \30E8 \30E9 \30EA \30EB \30EC \30ED \30EF \30F2 \30F3;
15241597
/* ア イ ウ エ オ カ キ ク ケ コ サ シ ス セ ソ タ チ ツ テ ト ナ ニ ヌ ネ ノ ハ ヒ フ ヘ ホ マ ミ ム メ モ ヤ ユ ヨ ラ リ ル レ ロ ワ ヲ ン */
1525-
suffix: 、;
1598+
suffix: '、';
15261599
}
15271600

1528-
@counter-style <dfn
1529-
id=katakana-iroha>katakana-iroha</dfn> {
1601+
@counter-style katakana-iroha {
15301602
type: alphabetic;
15311603
symbols: \30A4 \30ED \30CF \30CB \30DB \30D8 \30C8 \30C1 \30EA \30CC \30EB \30F2 \30EF \30AB \30E8 \30BF \30EC \30BD \30C4 \30CD \30CA \30E9 \30E0 \30A6 \30F0 \30CE \30AA \30AF \30E4 \30DE \30B1 \30D5 \30B3 \30A8 \30C6 \30A2 \30B5 \30AD \30E6 \30E1 \30DF \30B7 \30F1 \30D2 \30E2 \30BB \30B9 \30F3;
15321604
/* イ ロ ハ ニ ホ ヘ ト チ リ ヌ ル ヲ ワ カ ヨ タ レ ソ ツ ネ ナ ラ ム ウ ヰ ノ オ ク ヤ マ ケ フ コ エ テ ア サ キ ユ メ ミ シ ヱ ヒ モ セ ス ン */
@@ -1538,36 +1610,37 @@ <h3 id=simple-symbolic><span class=secno>5.3. </span> Symbolic: ‘<a
15381610
href="#circle"><code class=css>circle</code></a>’, ‘<a
15391611
href="#square"><code class=css>square</code></a>’</h3>
15401612

1541-
<p> In addition to the above styles, UAs must define three counter styles
1542-
named ‘<a href="#disc"><code class=css>disc</code></a>’, ‘<a
1543-
href="#circle"><code class=css>circle</code></a>’, and ‘<a
1544-
href="#square"><code class=css>square</code></a>’. They must do so
1545-
either by including the following stylesheet in their UA stylesheet, or by
1546-
rendering the bullets with a browser-generated image matching the
1547-
descriptions below the stylesheet.
1548-
1549-
<p> If a browser chooses to render these counter styles by generating
1550-
images, the images must be sized to attractively fill a 1em by 1em
1551-
rectangle. As well, the styles must still be overrideable by a later ‘<a
1552-
href="#at-counter-style"><code class=css>@counter-style</code></a>’ rule
1553-
defining a counter style of the same name, as if they were defined by a
1554-
‘<a href="#at-counter-style"><code
1555-
class=css>@counter-style</code></a>’ rule in the UA stylesheet.
1613+
<dl>
1614+
<dt>disc
1615+
1616+
<dd>A filled circle, similar to • U+2022 BULLET.
1617+
1618+
<dt>circle
1619+
1620+
<dd>A hollow circle, similar to ◦ U+25E6 WHITE BULLET.
1621+
1622+
<dt>square
1623+
1624+
<dd>A filled square, similar to ◾ U+25FE BLACK MEDIUM SMALL SQUARE.
1625+
</dl>
1626+
1627+
<p> The following stylesheet fragment provides the normative definition of
1628+
these predefined counter styles:
15561629

15571630
<pre class=stylesheet>
15581631
@counter-style <dfn id=disc>disc</dfn> {
15591632
type: cyclic;
15601633
symbols: \2022;
15611634
/* • */
1562-
suffix: ;
1635+
suffix: '';
15631636
}
15641637

15651638
@counter-style <dfn
15661639
id=circle>circle</dfn> {
15671640
type: cyclic;
15681641
symbols: \25E6;
15691642
/* ◦ */
1570-
suffix: ;
1643+
suffix: '';
15711644
}
15721645

15731646
@counter-style <dfn
@@ -1578,20 +1651,11 @@ <h3 id=simple-symbolic><span class=secno>5.3. </span> Symbolic: ‘<a
15781651
suffix: '';
15791652
}</pre>
15801653

1581-
<dl>
1582-
<dt>disc
1583-
1584-
<dd>A filled circle, similar to • U+2022 BULLET.
1585-
1586-
<dt>circle
1587-
1588-
<dd>A hollow circle, similar to ◦ U+25E6 WHITE BULLET.
1589-
1590-
<dt>square
1591-
1592-
<dd>A filled square, similar to ◾ U+25FE BLACK MEDIUM SMALL SQUARE.
1593-
</dl>
1594-
<!-- ======================================================================= -->
1654+
<p> Alternately, a browser may render these styles using a
1655+
browser-generated image instead of the defined character. If so, the image
1656+
must look similar to the character, and must be sized to attractively fill
1657+
a 1em by 1em square.
1658+
<!-- ======================================================================= -->
15951659

15961660
<h2 id=complex-predefined-counters><span class=secno>6. </span> Complex
15971661
Predefined Counter Styles</h2>

0 commit comments

Comments
 (0)