CINXE.COM

<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <meta name="generator" content="ReSpec 35.1.1"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <style> .issue-label{text-transform:initial} .warning>p:first-child{margin-top:0} .warning{padding:.5em;border-left-width:.5em;border-left-style:solid} span.warning{padding:.1em .5em .15em} .issue.closed span.issue-number{text-decoration:line-through} .issue.closed span.issue-number::after{content:" (Closed)";font-size:smaller} .warning{border-color:#f11;border-color:var(--warning-border,#f11);border-width:.2em;border-style:solid;background:#fbe9e9;background:var(--warning-bg,#fbe9e9);color:#000;color:var(--text,#000)} .warning-title:before{content:"⚠";font-size:1.3em;float:left;padding-right:.3em;margin-top:-.3em} li.task-list-item{list-style:none} input.task-list-item-checkbox{margin:0 .35em .25em -1.6em;vertical-align:middle} .issue a.respec-gh-label{padding:5px;margin:0 2px 0 2px;font-size:10px;text-transform:none;text-decoration:none;font-weight:700;border-radius:4px;position:relative;bottom:2px;border:none;display:inline-block} </style> <style> dfn{cursor:pointer} .dfn-panel{position:absolute;z-index:35;min-width:300px;max-width:500px;padding:.5em .75em;margin-top:.6em;font-family:"Helvetica Neue",sans-serif;font-size:small;background:#fff;background:var(--indextable-hover-bg,#fff);color:#000;color:var(--text,#000);box-shadow:0 1em 3em -.4em rgba(0,0,0,.3),0 0 1px 1px rgba(0,0,0,.05);box-shadow:0 1em 3em -.4em var(--tocsidebar-shadow,rgba(0,0,0,.3)),0 0 1px 1px var(--tocsidebar-shadow,rgba(0,0,0,.05));border-radius:2px} .dfn-panel:not(.docked)>.caret{position:absolute;top:-9px} .dfn-panel:not(.docked)>.caret::after,.dfn-panel:not(.docked)>.caret::before{content:"";position:absolute;border:10px solid transparent;border-top:0;border-bottom:10px solid #fff;border-bottom-color:var(--indextable-hover-bg,#fff);top:0} .dfn-panel:not(.docked)>.caret::before{border-bottom:9px solid #a2a9b1;border-bottom-color:var(--indextable-hover-bg,#a2a9b1)} .dfn-panel *{margin:0} .dfn-panel b{display:block;color:#000;color:var(--text,#000);margin-top:.25em} .dfn-panel ul a[href]{color:#333;color:var(--text,#333)} .dfn-panel>div{display:flex} .dfn-panel a.self-link{font-weight:700;margin-right:auto} .dfn-panel .marker{padding:.1em;margin-left:.5em;border-radius:.2em;text-align:center;white-space:nowrap;font-size:90%;color:#040b1c} .dfn-panel .marker.dfn-exported{background:#d1edfd;box-shadow:0 0 0 .125em #1ca5f940} .dfn-panel .marker.idl-block{background:#8ccbf2;box-shadow:0 0 0 .125em #0670b161} .dfn-panel a:not(:hover){text-decoration:none!important;border-bottom:none!important} .dfn-panel a[href]:hover{border-bottom-width:1px} .dfn-panel ul{padding:0} .dfn-panel li{margin-left:1em} .dfn-panel.docked{position:fixed;left:.5em;top:unset;bottom:2em;margin:0 auto;max-width:calc(100vw - .75em * 2 - .5em - .2em * 2);max-height:30vh;overflow:auto} </style> <title>Ready-made Counter Styles</title> <link rel="stylesheet" href="local.css"> <style id="respec-mainstyle"> @keyframes pop{ 0%{transform:scale(1,1)} 25%{transform:scale(1.25,1.25);opacity:.75} 100%{transform:scale(1,1)} } a.internalDFN{color:inherit;border-bottom:1px solid #99c;text-decoration:none} a.externalDFN{color:inherit;border-bottom:1px dotted #ccc;text-decoration:none} a.bibref{text-decoration:none} .respec-offending-element:target{animation:pop .25s ease-in-out 0s 1} .respec-offending-element,a[href].respec-offending-element{text-decoration:red wavy underline} @supports not (text-decoration:red wavy underline){ .respec-offending-element:not(pre){display:inline-block} .respec-offending-element{background:url(data:image/gif;base64,R0lGODdhBAADAPEAANv///8AAP///wAAACwAAAAABAADAEACBZQjmIAFADs=) bottom repeat-x} } #references :target{background:#eaf3ff;animation:pop .4s ease-in-out 0s 1} cite .bibref{font-style:normal} a[href].orcid{padding-left:4px;padding-right:4px} a[href].orcid>svg{margin-bottom:-2px} ol.tof,ul.tof{list-style:none outside none} .caption{margin-top:.5em;font-style:italic} #issue-summary>ul{column-count:2} #issue-summary li{list-style:none;display:inline-block} details.respec-tests-details{margin-left:1em;display:inline-block;vertical-align:top} details.respec-tests-details>*{padding-right:2em} details.respec-tests-details[open]{z-index:999999;position:absolute;border:thin solid #cad3e2;border-radius:.3em;background-color:#fff;padding-bottom:.5em} details.respec-tests-details[open]>summary{border-bottom:thin solid #cad3e2;padding-left:1em;margin-bottom:1em;line-height:2em} details.respec-tests-details>ul{width:100%;margin-top:-.3em} details.respec-tests-details>li{padding-left:1em} .self-link:hover{opacity:1;text-decoration:none;background-color:transparent} aside.example .marker>a.self-link{color:inherit} .header-wrapper{display:flex;align-items:baseline} :is(h2,h3,h4,h5,h6):not(#toc>h2,#abstract>h2,#sotd>h2,.head>h2){position:relative;left:-.5em} :is(h2,h3,h4,h5,h6):not(#toch2)+a.self-link{color:inherit;order:-1;position:relative;left:-1.1em;font-size:1rem;opacity:.5} :is(h2,h3,h4,h5,h6)+a.self-link::before{content:"§";text-decoration:none;color:var(--heading-text)} :is(h2,h3)+a.self-link{top:-.2em} :is(h4,h5,h6)+a.self-link::before{color:#000} @media (max-width:767px){ dd{margin-left:0} } @media print{ .removeOnSave{display:none} } </style> <style class="cs"> /* ADLAM */ @counter-style adlam { system: numeric; symbols: '\01E950' '\01E951' '\01E952' '\01E953' '\01E954' '\01E955' '\01E956' '\01E957' '\01E958' '\01E959'; } /* ARABIC */ @counter-style arabic-indic { system: numeric; symbols: \660 \661 \662 \663 \664 \665 \666 \667 \668 \669; } @counter-style arabic-abjad { system: fixed; symbols: '\627' '\628' '\62C' '\62F' '\647\200D' '\648' '\632' '\62D' '\637' '\64A' '\643' '\644' '\645' '\646' '\633' '\639' '\641' '\635' '\642' '\631' '\634' '\62A' '\62B' '\62E' '\630' '\636' '\638' '\63A'; } @counter-style kashmiri { system: alphabetic; symbols: '\0627' '\0622' '\0628' '\067E' '\062A' '\0679' '\062B' '\062C' '\0686' '\062D' '\062E' '\062F' '\0688' '\0630' '\0631' '\0691' '\0632' '\0698' '\0633' '\0634' '\0635' '\0636' '\0637' '\0638' '\0639' '\063A' '\0641' '\0642' '\06A9' '\06AF' '\0644' '\0645' '\0646' '\06BA' '\0648' '\06C1' '\06BE' '\0621' '\06CC' '\06D2' '\06C4' '\0620'; suffix: ') '; } @counter-style maghrebi-abjad { system: fixed; symbols: '\627' '\628' '\62C' '\62F' '\647\200D' '\648' '\632' '\62D' '\637' '\64A' '\643' '\644' '\645' '\646' '\636' '\639' '\641' '\635' '\642' '\631' '\633' '\62A' '\62B' '\62E' '\630' '\638' '\63A' '\634'; } @counter-style persian { system: numeric; symbols: '\6F0' '\6F1' '\6F2' '\6F3' '\6F4' '\6F5' '\6F6' '\6F7' '\6F8' '\6F9'; } @counter-style persian-abjad { system: fixed; symbols: '\627' '\628' '\62C' '\62F' '\647\200D' '\648' '\632' '\62D' '\637' '\6CC' '\6A9' '\644' '\645' '\646' '\633' '\639' '\641' '\635' '\642' '\631' '\634' '\62A' '\62B' '\62E' '\630' '\636' '\638' '\63A'; } @counter-style persian-alphabetic { system: fixed; symbols: '\627' '\628' '\67E' '\62A' '\62B' '\62C' '\686' '\62D' '\62E' '\62F' '\630' '\631' '\632' '\698' '\633' '\634' '\635' '\636' '\637' '\638' '\639' '\63A' '\641' '\642' '\6A9' '\6AF' '\644' '\645' '\646' '\648' '\647\200D' '\6CC'; } @counter-style urdu { system: numeric; symbols: '\6F0' '\6F1' '\6F2' '\6F3' '\6F4' '\6F5' '\6F6' '\6F7' '\6F8' '\6F9'; suffix: '\06D4 '; } @counter-style urdu-alphabetic { system: fixed; symbols: '\0627' '\0628' '\067E' '\062A' '\0679' '\062B' '\062C' '\0686' '\062D' '\062E' '\062F' '\0688' '\0630' '\0631' '\0691' '\0632' '\0698' '\0633' '\0634' '\0635' '\0636' '\0637' '\0638' '\0639' '\063A' '\0641' '\0642' '\06A9' '\06AF' '\0644' '\0645' '\0646' '\06BA' '\0648' '\06C1' '\06BE' '\0621' '\06CC'; } @counter-style urdu-abjad { system: fixed; symbols: '\0627' '\0628' '\062C' '\062F' '\06C1' '\0648' '\0632' '\062D' '\0637' '\06CC' '\06A9' '\0644' '\0645' '\0646' '\0633' '\0639' '\0641' '\0635' '\0642' '\0631' '\0634' '\062A' '\062B' '\062E' '\0630' '\0636' '\0638' '\063A '; } /* ARMENIAN */ @counter-style armenian { system: additive; range: 1 9999; 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'; } @counter-style lower-armenian { system: additive; range: 1 9999; additive-symbols: 9000 '\584', 8000 '\583', 7000 '\582', 6000 '\581', 5000 '\580', 4000 '\57F', 3000 '\57E', 2000 '\57D', 1000 '\57C', 900 '\57B', 800 '\57A', 700 '\579', 600 '\578', 500 '\577', 400 '\576', 300 '\575', 200 '\574', 100 '\573', 90 '\572', 80 '\571', 70 '\570', 60 '\56F', 50 '\56E', 40 '\56D', 30 '\56C', 20 '\56B', 10 '\56A', 9 '\569', 8 '\568', 7 '\567', 6 '\566', 5 '\565', 4 '\564', 3 '\563', 2 '\562', 1 '\561'; } @counter-style upper-armenian { system: additive; range: 1 9999; 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'; } /* BALINESE */ @counter-style balinese { system: numeric; symbols: \1B50 \1B51 \1B52 \1B53 \1B54 \1B55 \1B56 \1B57 \1B58 \1B59; } /* BAMUM */ @counter-style bamum { system: numeric; symbols: '\A6EF' '\A6E6' '\A6E7' '\A6E8' '\A6E9' '\A6EA' '\A6EB' '\A6EC' '\A6ED' '\A6EE' ; } /* BENGALI */ @counter-style bengali { system: numeric; symbols: '\9E6' '\9E7' '\9E8' '\9E9' '\9EA' '\9EB' '\9EC' '\9ED' '\9EE' '\9EF'; } @counter-style bangla { system: alphabetic; symbols: '\0995' '\0996' '\0997' '\0998' '\0999' '\099A' '\099B' '\099C' '\099D' '\099E' '\099F' '\09A0' '\09A1' '\09A1\09BC' '\09A2' '\09A2\09BC' '\09A3' '\09A4' '\09CE' '\09A5' '\09A6' '\09A7' '\09A8' '\09AA' '\09AB' '\09AC' '\09AD' '\09AE' '\09AF' '\09AF\09BC' '\09B0' '\09B2' '\09B6' '\09B7' '\09B8' '\09B9' ; suffix: ') '; } /* BOPOMOFO */ @counter-style zhuyin { system: alphabetic; symbols: "\3105" "\3106" "\3107" "\3108" "\3109" "\310A" "\310B" "\310C" "\310D" "\310E" "\310F" "\3110" "\3111" "\3112" "\3113" "\3114" "\3115" "\3116" "\3117" "\3118" "\3119" "\311A" "\311B" "\311C" "\311D" "\311E" "\311F" "\3120" "\3121" "\3122" "\3123" "\3124" "\3125" "\3126" "\3127" "\3128" "\3129"; /* ㄅㄆㄇㄈㄉㄊㄋㄌㄍㄎㄏㄐㄑㄒㄓㄔㄕㄖㄗㄘㄙㄚㄛㄜㄝㄞㄟㄠㄡㄢㄣㄤㄥㄦㄧㄨㄩ */ suffix: "、"; } /* CYRILLIC */ @counter-style lower-belorussian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\435' '\451' '\436' '\437' '\456' '\439' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\45E' '\444' '\445' '\446' '\447' '\448' '\44B' '\44C' '\44D' '\44E' '\44F'; suffix: ') '; } @counter-style upper-belorussian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\415' '\401' '\416' '\417' '\406' '\419' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\40E' '\424' '\425' '\426' '\427' '\428' '\42B' '\42C' '\42D' '\42E' '\42F'; } @counter-style lower-bulgarian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\435' '\436' '\437' '\438' '\439' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\444' '\445' '\446' '\447' '\448' '\449' '\44A' '\44C' '\44E' '\44F'; suffix: ') '; } @counter-style upper-bulgarian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\415' '\416' '\417' '\418' '\419' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\424' '\425' '\426' '\427' '\428' '\429' '\42A' '\42C' '\42E' '\42F'; } @counter-style lower-macedonian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\453' '\435' '\436' '\437' '\455' '\438' '\458' '\43A' '\43B' '\459' '\43C' '\43D' '\45A' '\43E' '\43F' '\440' '\441' '\442' '\45C' '\443' '\444' '\445' '\446' '\447' '\45F' '\448'; suffix: ') '; } @counter-style upper-macedonian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\403' '\415' '\416' '\417' '\405' '\418' '\408' '\41A' '\41B' '\409' '\41C' '\41D' '\40A' '\41E' '\41F' '\420' '\421' '\422' '\40C' '\423' '\424' '\425' '\426' '\427' '\40F' '\428'; } @counter-style lower-russian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\435' '\436' '\437' '\438' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\444' '\445' '\446' '\447' '\448' '\449' '\44D' '\44E' '\44F'; suffix: ') '; } @counter-style upper-russian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\415' '\416' '\417' '\418' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\424' '\425' '\426' '\427' '\428' '\429' '\42D' '\42E' '\42F'; } @counter-style lower-russian-full { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\435' '\451' '\436' '\437' '\438' '\439' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\444' '\445' '\446' '\447' '\448' '\449' '\44A' '\44B' '\44C' '\44D' '\44E' '\44F'; suffix: ') '; } @counter-style upper-russian-full { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\415' '\401' '\416' '\417' '\418' '\419' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\424' '\425' '\426' '\427' '\428' '\429' '\42A' '\42B' '\42C' '\42D' '\42E' '\42F'; } @counter-style lower-serbian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\452' '\435' '\436' '\437' '\438' '\458' '\43A' '\43B' '\459' '\43C' '\43D' '\45A' '\43E' '\43F' '\440' '\441' '\442' '\45B' '\443' '\444' '\445' '\446' '\447' '\45F' '\448'; suffix: ') '; } @counter-style upper-serbian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\402' '\415' '\416' '\417' '\418' '\408' '\41A' '\41B' '\409' '\41C' '\41D' '\40A' '\41E' '\41F' '\420' '\421' '\422' '\40B' '\423' '\424' '\425' '\426' '\427' '\40F' '\428'; } @counter-style lower-ukrainian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\435' '\454' '\436' '\437' '\438' '\456' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\444' '\445' '\446' '\447' '\448' '\44E' '\44F'; suffix: ') '; } @counter-style upper-ukrainian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\415' '\404' '\416' '\417' '\418' '\406' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\424' '\425' '\426' '\427' '\428' '\42E' '\42F'; } @counter-style lower-ukrainian-full { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\491' '\434' '\435' '\454' '\436' '\437' '\438' '\456' '\457' '\439' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\444' '\445' '\446' '\447' '\448' '\449' '\44C' '\44E' '\44F'; suffix: ') '; } @counter-style upper-ukrainian-full { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\490' '\414' '\415' '\404' '\416' '\417' '\418' '\406' '\407' '\419' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\424' '\425' '\426' '\427' '\428' '\429' '\42C' '\42E' '\42F'; } /* DEVANAGARI */ @counter-style bodo { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' ; suffix: ') '; } @counter-style devanagari { system: numeric; symbols: '\966' '\967' '\968' '\969' '\96A' '\96B' '\96C' '\96D' '\96E' '\96F'; } @counter-style dogri { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939'; suffix: ') '; } @counter-style hindi { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939'; } @counter-style konkani { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' '\933'; suffix: ') '; } @counter-style maithili { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' ; suffix: ') '; } @counter-style marathi { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' '\933'; suffix: ') '; } @counter-style sanskrit { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' ; suffix: ') '; } @counter-style sindhi { system: alphabetic; symbols: '\0915' '\0916' '\0916 \093C' '\0917' '\097B' '\0917 \093C' '\0918' '\0919' '\091A' '\091B' '\091C' '\097C' '\091C\093C' '\091D' '\091E' '\091F' '\0920' '\0921' '\097E' '\0921\093C' '\0922' '\0922 \093C' '\0923' '\0924' '\0925' '\0926' '\0927' '\0928' '\092A' '\092B' '\092B\093C' '\092C' '\097F' '\092D' '\092E' '\092F' '\0930' '\0932' '\0935' '\0936' '\0937' '\0938' '\0939' ; suffix: ') '; } /* ETHIOPIC */ @counter-style afar { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1260' '\1270' '\1290' '\12A0' '\12A8' '\12C8' '\12D0' '\12E8' '\12F0' '\12F8' '\1308' '\1338' '\1348'; suffix: '\1366 '; } @counter-style agaw { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1238' '\1240' '\1250' '\1260' '\1268' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308' '\1318' '\1320' '\1328' '\1330' '\1338' '\1348' '\1350'; suffix: '\1366 '; } @counter-style ari { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1260' '\1268' '\1270' '\1278' '\1290' '\1300' '\1308' '\1328' '\1340' '\1350'; suffix: '\1366 '; } @counter-style blin { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1230' '\1238' '\1228' '\1240' '\1250' '\1260' '\1270' '\1290' '\1300' '\1308' '\1318' '\1320' '\1328' '\1348' '\1278' '\1298' '\1338' '\1330' '\1350'; suffix: '\1366 '; } @counter-style dizi { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308' '\1320' '\1328' '\1338' '\1340' '\1348'; suffix: '\1366 '; } @counter-style ethiopic-halehame { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1240' '\1260' '\1270' '\1280' '\1290' '\12A0' '\12A8' '\12C8' '\12D0' '\12D8' '\12E8' '\12F0' '\1308' '\1320' '\1330' '\1338' '\1340' '\1348' '\1350'; suffix: '\1366 '; } @counter-style ethiopic-halehame-am { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1280' '\1290' '\1298' '\12A0' '\12A8' '\12B8' '\12C8' '\12D0' '\12D8' '\12E0' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1340' '\1348' '\1350'; suffix: '\1366 '; } @counter-style ethiopic-halehame-ti-er { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1238' '\1240' '\1250' '\1260' '\1270' '\1278' '\1290' '\1298' '\12A0' '\12A8' '\12B8' '\12C8' '\12D0' '\12D8' '\12E0' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348' '\1350'; suffix: '\1366 '; } @counter-style ethiopic-halehame-ti-et { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1238' '\1240' '\1250' '\1260' '\1270' '\1278' '\1280' '\1290' '\1298' '\12A0' '\12A8' '\12B8' '\12C8' '\12D0' '\12D8' '\12E0' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1340' '\1348' '\1350'; suffix: '\1366 '; } @counter-style gedeo { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348' '\1350'; suffix: '\1366 '; } @counter-style gumuz { system: alphabetic; symbols: '\1200' '\1210' '\1208' '\1210' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1268' '\1270' '\1278' '\1290' '\1298' '\1308' '\1328' '\1330' '\1340' '\1350'; suffix: '\1366 '; } @counter-style hadiyya { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1300' '\1308' '\1320' '\1328' '\1330' '\1348' '\1350'; suffix: '\1366 '; } @counter-style harari { system: alphabetic; symbols: '\1210' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308' '\1320' '\1328' '\1348'; suffix: '\1366 '; } @counter-style kaffa { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1280' '\1290' '\1300' '\1308' '\1320' '\1328' '\1330' '\1348' '\1350'; suffix: '\1366 '; } @counter-style kebena { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1300' '\1308' '\1320' '\1328' '\1330' '\1348' '\1350'; suffix: '\1366 '; } @counter-style kembata { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1268' '\1270' '\1278' '\1290' '\1300' '\1308' '\1320' '\1328' '\1330' '\1348'; suffix: '\1366 '; } @counter-style konso { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\1300' '\1348' '\1350'; suffix: '\1366 '; } @counter-style kunama { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1260' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308'; suffix: '\1366 '; } @counter-style meen { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1280' '\1290' '\1298' '\1300' '\1308' '\1320' '\1328' '\1330' '\1350' '\1340'; suffix: '\1366 '; } @counter-style oromo { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\12A0' '\12A8' '\12C8' '\12E8' '\12F0' '\12F8' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348'; suffix: '\1366 '; } @counter-style saho { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1240' '\1260' '\1270' '\1290' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348'; suffix: '\1366 '; } @counter-style sidama { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\12A0' '\12A8' '\12C8' '\12E8' '\12F0' '\12F8' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348'; suffix: '\1366 '; } @counter-style silti { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308' '\1320' '\1328' '\1330' '\1348'; suffix: '\1366 '; } @counter-style tigre { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\12A0' '\12A8' '\12C8' '\12D0' '\12D8' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348' '\1350'; suffix: '\1366 '; } @counter-style wolaita { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\1230' '\1308' '\1320' '\1328' '\1330' '\1338' '\1340' '\1348' '\1350'; suffix: '\1366 '; } @counter-style yemsa { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1268' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308' '\1318' '\1320' '\1328' '\1330' '\1348' '\1350'; suffix: '\1366 '; } /* GEORGIAN */ @counter-style georgian { system: additive; range: 1 19999; 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'; } /* GREEK */ @counter-style greek-lower-modern { system: additive; range: 1 999; additive-symbols: 900 \3E1, 800 \3C9, 700 \3C8, 600 \3C7, 500 \3C6, 400 \3C5, 300 \3C4, 200 \3C3, 100 \3C1, 90 \3DF, 80 \3C0, 70 \3BF, 60 \3BE, 50 \3BD, 40 \3BC, 30 \3BB, 20 \3BA, 10 \3B9, 9 \3B8, 8 \3B7, 7 \3B6, 6 \3C3\3C4, 5 \3B5, 4 \3B4, 3 \3B3, 2 \3B2, 1 \3B1; } @counter-style greek-upper-modern { system: additive; range: 1 999; additive-symbols: 900 \3E0, 800 \3A9, 700 \3A8, 600 \3A7, 500 \3A6, 400 \3A5, 300 \3A4, 200 \3A3, 100 \3A1, 90 \3DE, 80 \3A0, 70 \39F, 60 \39E, 50 \39D, 40 \39C, 30 \39B, 20 \39A, 10 \399, 9 \398, 8 \397, 7 \396, 6 \3A3\3A4, 5 \395, 4 \394, 3 \393, 2 \392, 1 \391; } @counter-style greek-lower-ancient { system: additive; range: 1 999; additive-symbols: 900 \3E1, 800 \3C9, 700 \3C8, 600 \3C7, 500 \3C6, 400 \3C5, 300 \3C4, 200 \3C3, 100 \3C1, 90 \3DF, 80 \3C0, 70 \3BF, 60 \3BE, 50 \3BD, 40 \3BC, 30 \3BB, 20 \3BA, 10 \3B9, 9 \3B8, 8 \3B7, 7 \3B6, 6 \3DB, 5 \3B5, 4 \3B4, 3 \3B3, 2 \3B2, 1 \3B1; } @counter-style greek-upper-ancient { system: additive; range: 1 999; additive-symbols: 900 \3E0, 800 \3A9, 700 \3A8, 600 \3A7, 500 \3A6, 400 \3A5, 300 \3A4, 200 \3A3, 100 \3A1, 90 \3DE, 80 \3A0, 70 \39F, 60 \39E, 50 \39D, 40 \39C, 30 \39B, 20 \39A, 10 \399, 9 \398, 8 \397, 7 \396, 6 \3DA, 5 \395, 4 \394, 3 \393, 2 \392, 1 \391; } @counter-style lower-greek { system: alphabetic; 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'; } /* GUJARATI */ @counter-style gujarati { system: numeric; symbols: '\AE6' '\AE7' '\AE8' '\AE9' '\AEA' '\AEB' '\AEC' '\AED' '\AEE' '\AEF'; } @counter-style gujarati-alpha { system: alphabetic; symbols: '\0A95' '\0A96' '\0A97' '\0A98' '\0A99' '\0A9A' '\0A9B' '\0A9C' '\0A9D' '\0A9E' '\0A9F' '\0AA0' '\0AA1' '\0AA2' '\0AA3' '\0AA4' '\0AA5' '\0AA6' '\0AA7' '\0AA8' '\0AAA' '\0AAB' '\0AAC' '\0AAD' '\0AAE' '\0AAF' '\0AB0' '\0AB2' '\0AB5' '\0AB6' '\0AB7' '\0AB8' '\0AB9' '\0AB3'; prefix: '( '; suffix: ' ) '; } /* GURMUKHI */ @counter-style gurmukhi { system: numeric; symbols: '\A66' '\A67' '\A68' '\A69' '\A6A' '\A6B' '\A6C' '\A6D' '\A6E' '\A6F'; } @counter-style punjabi { system: alphabetic; symbols: '\0A73' '\0A05' '\0A72' '\0A38' '\0A39' '\0A15' '\0A16' '\0A17' '\0A18' '\0A19' '\0A1A' '\0A1B' '\0A1C' '\0A1D' '\0A1E' '\0A1F' '\0A20' '\0A21 ' '\0A22' '\0A23' '\0A24' '\0A25' '\0A26' '\0A27' '\0A28' '\0A2A' '\0A2B ' '\0A2C' '\0A2D' '\0A2E' '\0A2F' '\0A30' '\0A32' '\0A35' '\0A5C' ; suffix: ') '; } /* HANIFI ROHINGYA */ @counter-style hanifi-rohingya { system: numeric; symbols: '\10D30' '\10D31' '\10D32' '\10D33' '\10D34' '\10D35' '\10D36' '\10D37' '\10D38' '\10D39'; } /* HEBREW */ @counter-style hebrew { system: additive; range: 1 10999; additive-symbols: 10000 \5D9\5F3, 9000 \5D8\5F3, 8000 \5D7\5F3, 7000 \5D6\5F3, 6000 \5D5\5F3, 5000 \5D4\5F3, 4000 \5D3\5F3, 3000 \5D2\5F3, 2000 \5D1\5F3, 1000 \5D0\5F3, 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; } /* HAN */ @counter-style cjk-decimal { system: numeric; range: 0 infinite; symbols: '\3007' '\4E00' '\4E8C' '\4E09' '\56DB' '\4E94' '\516D' '\4E03' '\516B' '\4E5D'; suffix: '\3001'; } @counter-style cjk-earthly-branch { system: fixed; symbols: '\5B50' '\4E11' '\5BC5' '\536F' '\8FB0' '\5DF3' '\5348' '\672A' '\7533' '\9149' '\620C' '\4EA5'; suffix: '\3001'; fallback: cjk-decimal; } @counter-style cjk-heavenly-stem { system: fixed; symbols: '\7532' '\4E59' '\4E19' '\4E01' '\620A' '\5DF1' '\5E9A' '\8F9B' '\58EC' '\7678'; suffix: '\3001'; fallback: cjk-decimal; } @counter-style circled-ideograph { system: fixed; symbols: '\3280' '\3281' '\3282' '\3283' '\3284' '\3285' '\3286' '\3287' '\3288' '\3289'; suffix: ' '; } @counter-style parenthesized-ideograph { system: fixed; symbols: '\3220' '\3221' '\3222' '\3223' '\3224' '\3225' '\3226' '\3227' '\3228' '\3229'; suffix: ' '; } @counter-style cjk-tally-mark { system: additive; additive-symbols: 5 '\1D376', 4 '\1D375', 3 '\1D374', 2 '\1D373', 1 '\1D372'; suffix: ' '; } @counter-style cjk-stem-branch { system: cyclic; symbols: '\7532\5B50' '\4E59\4E11' '\4E19\5BC5' '\4E01\536F' '\620A\8FB0' '\5DF1\5DF3' '\5E9A\5348' '\8F9B\672A' '\58EC\7533' '\7678\9149' '\7532\620C' '\4E59\4EA5' '\4E19\5B50' '\4E01\4E11' '\620A\5BC5' '\5DF1\536F' '\5E9A\8FB0' '\8F9B\5DF3' '\58EC\5348' '\7678\672A' '\7532\7533' '\4E59\9149' '\4E19\620C' '\4E01\4EA5' '\620A\5B50' '\5DF1\4E11' '\5E9A\5BC5' '\8F9B\536F' '\58EC\8FB0' '\7678\5DF3' '\7532\5348' '\4E59\672A' '\4E19\7533' '\4E01\9149' '\620A\620C' '\5DF1\4EA5' '\5E9A\5B50' '\8F9B\4E11' '\58EC\5BC5' '\7678\536F' '\7532\8FB0' '\4E59\5DF3' '\4E19\5348' '\4E01\672A' '\620A\7533' '\5DF1\9149' '\5E9A\620C' '\8F9B\4EA5' '\58EC\5B50' '\7678\4E11' '\7532\5BC5' '\4E59\536F' '\4E19\8FB0' '\4E01\5DF3' '\620A\5348' '\5DF1\672A' '\5E9A\7533' '\8F9B\9149' '\58EC\620C' '\7678\4EA5'; suffix: '、'; } /* JAPANESE */ @counter-style hiragana { system: alphabetic; 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' '\3090' '\3091' '\3092' '\3093'; suffix: '、'; } @counter-style hiragana-iroha { system: alphabetic; 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'; suffix: '、'; } @counter-style katakana { system: alphabetic; 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' '\30F0' '\30F1' '\30F2' '\30F3'; suffix: '、'; } @counter-style katakana-iroha { system: alphabetic; 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'; suffix: '、'; } @counter-style circled-katakana { system: fixed; symbols: '\32D0' '\32D1' '\32D2' '\32D3' '\32D4' '\32D5' '\32D6' '\32D7' '\32D8' '\32D9' '\32DA' '\32DB' '\32DC' '\32DD' '\32DE' '\32DF' '\32E0' '\32E1' '\32E2' '\32E3' '\32E4' '\32E5' '\32E6' '\32E7' '\32E8' '\32E9' '\32EA' '\32EB' '\32EC' '\32ED' '\32EE' '\32EF' '\32F0' '\32F1' '\32F2' '\32F3' '\32F4' '\32F5' '\32F6' '\32F7' '\32F8' '\32F9' '\32FA' '\32FB' '\32FC' '\32FD' '\32FE'; suffix: ' '; } @counter-style japanese-informal { system: additive; range: -9999 9999; additive-symbols: 9000 \4E5D\5343, 8000 \516B\5343, 7000 \4E03\5343, 6000 \516D\5343, 5000 \4E94\5343, 4000 \56DB\5343, 3000 \4E09\5343, 2000 \4E8C\5343, 1000 \5343, 900 \4E5D\767E, 800 \516B\767E, 700 \4E03\767E, 600 \516D\767E, 500 \4E94\767E, 400 \56DB\767E, 300 \4E09\767E, 200 \4E8C\767E, 100 \767E, 90 \4E5D\5341, 80 \516B\5341, 70 \4E03\5341, 60 \516D\5341, 50 \4E94\5341, 40 \56DB\5341, 30 \4E09\5341, 20 \4E8C\5341, 10 \5341, 9 \4E5D, 8 \516B, 7 \4E03, 6 \516D, 5 \4E94, 4 \56DB, 3 \4E09, 2 \4E8C, 1 \4E00, 0 \3007; suffix: '\3001'; negative: "\30DE\30A4\30CA\30B9"; fallback: cjk-decimal; } @counter-style japanese-formal { system: additive; range: -9999 9999; additive-symbols: 9000 \4E5D\9621, 8000 \516B\9621, 7000 \4E03\9621, 6000 \516D\9621, 5000 \4F0D\9621, 4000 \56DB\9621, 3000 \53C2\9621, 2000 \5F10\9621, 1000 \58F1\9621, 900 \4E5D\767E, 800 \516B\767E, 700 \4E03\767E, 600 \516D\767E, 500 \4F0D\767E, 400 \56DB\767E, 300 \53C2\767E, 200 \5F10\767E, 100 \58F1\767E, 90 \4E5D\62FE, 80 \516B\62FE, 70 \4E03\62FE, 60 \516D\62FE, 50 \4F0D\62FE, 40 \56DB\62FE, 30 \53C2\62FE, 20 \5F10\62FE, 10 \58F1\62FE, 9 \4E5D, 8 \516B, 7 \4E03, 6 \516D, 5 \4F0D, 4 \56DB, 3 \53C2, 2 \5F10, 1 \58F1, 0 \96F6; suffix: '\3001'; negative: "\30DE\30A4\30CA\30B9"; fallback: cjk-decimal; } /* JAVANESE */ @counter-style javanese { system: numeric; symbols: \A9D0 \A9D1 \A9D2 \A9D3 \A9D4 \A9D5 \A9D6 \A9D7 \A9D8 \A9D9 ; } /* KANNADA */ @counter-style kannada { system: numeric; symbols: '\CE6' '\CE7' '\CE8' '\CE9' '\CEA' '\CEB' '\CEC' '\CED' '\CEE' '\CEF'; } @counter-style kannada-alpha { system: alphabetic; symbols: '\0C85' '\0C86' '\0C87' '\0C88' '\0C89' '\0C8A' '\0C8B' '\0C8E' '\0C8F' '\0C90' '\0C92' '\0C93' '\0C94' '\0C95' '\0C96' '\0C97' '\0C98' '\0C99' ; suffix: ') '; } /* KAYAH LI */ @counter-style kayah-li { system: numeric; symbols: '\A901' '\A902' '\A903' '\A904' '\A905' '\A906' '\A907' '\A908' '\A909' '\A900'; } /* KHMER */ @counter-style cambodian { system: numeric; symbols: '\17E0' '\17E1' '\17E2' '\17E3' '\17E4' '\17E5' '\17E6' '\17E7' '\17E8' '\17E9'; } @counter-style khmer { system: numeric; symbols: '\17E0' '\17E1' '\17E2' '\17E3' '\17E4' '\17E5' '\17E6' '\17E7' '\17E8' '\17E9'; } @counter-style khmer-consonant { system: alphabetic; symbols: '\1780' '\1781' '\1782' '\1783' '\1784' '\1785' '\1786' '\1787' '\1788' '\1789' '\178A' '\178B' '\178C' '\178D' '\178E' '\178F' '\1790' '\1791' '\1792' '\1793' '\1794' '\1795' '\1796' '\1797' '\1798' '\1799' '\179A' '\179B' '\179C' '\179F' '\17A0' '\17A1' '\17A2'; } /* KOREAN */ @counter-style circled-korean-consonant { system: fixed; symbols: '\3260' '\3261' '\3262' '\3263' '\3264' '\3265' '\3266' '\3267' '\3268' '\3269' '\326A' '\326B' '\326C' '\326D'; suffix: ' '; } @counter-style circled-korean-syllable { system: fixed; symbols: '\326E' '\326F' '\3270' '\3271' '\3272' '\3273' '\3274' '\3275' '\3276' '\3277' '\3278' '\3279' '\327A' '\327B'; suffix: ' '; } @counter-style hangul { system: alphabetic; symbols: '\AC00' '\B098' '\B2E4' '\B77C' '\B9C8' '\BC14' '\C0AC' '\C544' '\C790' '\CC28' '\CE74' '\D0C0' '\D30C' '\D558'; } @counter-style hangul-consonant { system: alphabetic; symbols: '\3131' '\3134' '\3137' '\3139' '\3141' '\3142' '\3145' '\3147' '\3148' '\314A' '\314B' '\314C' '\314D' '\314E'; } @counter-style korean-consonant { system: alphabetic; symbols: '\3131' '\3134' '\3137' '\3139' '\3141' '\3142' '\3145' '\3147' '\3148' '\314A' '\314B' '\314C' '\314D' '\314E'; } @counter-style korean-hangul-formal { system: additive; range: -9999 9999; additive-symbols: 9000 '\AD6C\CC9C', 8000 '\D314\CC9C', 7000 '\CE60\CC9C', 6000 '\C721\CC9C', 5000 '\C624\CC9C', 4000 '\C0AC\CC9C', 3000 '\C0BC\CC9C', 2000 '\C774\CC9C', 1000 '\C77C\CC9C', 900 '\AD6C\BC31', 800 '\D314\BC31', 700 '\CE60\BC31', 600 '\C721\BC31', 500 '\C624\BC31', 400 '\C0AC\BC31', 300 '\C0BC\BC31', 200 '\C774\BC31', 100 '\C77C\BC31', 90 '\AD6C\C2ED', 80 '\D314\C2ED', 70 '\CE60\C2ED', 60 '\C721\C2ED', 50 '\C624\C2ED', 40 '\C0AC\C2ED', 30 '\C0BC\C2ED', 20 '\C774\C2ED', 10 '\C77C\C2ED', 9 '\AD6C', 8 '\D314', 7 '\CE60', 6 '\C721', 5 '\C624', 4 '\C0AC', 3 '\C0BC', 2 '\C774', 1 '\C77C', 0 '\C601'; suffix:', '; negative: "\B9C8\C774\B108\C2A4 "; } @counter-style korean-syllable { system: alphabetic; symbols: '\AC00' '\B098' '\B2E4' '\B77C' '\B9C8' '\BC14' '\C0AC' '\C544' '\C790' '\CC28' '\CE74' '\D0C0' '\D30C' '\D558'; } @counter-style parenthesized-hangul-consonant { system: fixed; symbols: '\3200' '\3201' '\3202' '\3203' '\3204' '\3205' '\3206' '\3207' '\3208' '\3209' '\320A' '\320B' '\320C' '\320D'; suffix: ' '; } @counter-style parenthesized-hangul-syllable { system: fixed; symbols: '\320E' '\320F' '\3210' '\3211' '\3212' '\3213' '\3214' '\3215' '\3216' '\3217' '\3218' '\3219' '\321A'; suffix: ' '; } @counter-style korean-hanja-informal { system: additive; range: -9999 9999; additive-symbols: 9000 \4E5D\5343, 8000 \516B\5343, 7000 \4E03\5343, 6000 \516D\5343, 5000 \4E94\5343, 4000 \56DB\5343, 3000 \4E09\5343, 2000 \4E8C\5343, 1000 \5343, 900 \4E5D\767E, 800 \516B\767E, 700 \4E03\767E, 600 \516D\767E, 500 \4E94\767E, 400 \56DB\767E, 300 \4E09\767E, 200 \4E8C\767E, 100 \767E, 90 \4E5D\5341, 80 \516B\5341, 70 \4E03\5341, 60 \516D\5341, 50 \4E94\5341, 40 \56DB\5341, 30 \4E09\5341, 20 \4E8C\5341, 10 \5341, 9 \4E5D, 8 \516B, 7 \4E03, 6 \516D, 5 \4E94, 4 \56DB, 3 \4E09, 2 \4E8C, 1 \4E00, 0 \96F6; suffix:', '; negative: "\B9C8\C774\B108\C2A4 "; } @counter-style korean-hanja-formal { system: additive; range: -9999 9999; additive-symbols: 9000 \4E5D\4EDF, 8000 \516B\4EDF, 7000 \4E03\4EDF, 6000 \516D\4EDF, 5000 \4E94\4EDF, 4000 \56DB\4EDF, 3000 \53C3\4EDF, 2000 \8CB3\4EDF, 1000 \58F9\4EDF, 900 \4E5D\767E, 800 \516B\767E, 700 \4E03\767E, 600 \516D\767E, 500 \4E94\767E, 400 \56DB\767E, 300 \53C3\767E, 200 \8CB3\767E, 100 \58F9\767E, 90 \4E5D\62FE, 80 \516B\62FE, 70 \4E03\62FE, 60 \516D\62FE, 50 \4E94\62FE, 40 \56DB\62FE, 30 \53C3\62FE, 20 \8CB3\62FE, 10 \58F9\62FE, 9 \4E5D, 8 \516B, 7 \4E03, 6 \516D, 5 \4E94, 4 \56DB, 3 \53C3, 2 \8CB3, 1 \58F9, 0 \96F6; suffix:', '; negative: "\B9C8\C774\B108\C2A4 "; } /* LANNA */ @counter-style lanna-hora { system: numeric; symbols: \1A80 \1A81 \1A82 \1A83 \1A84 \1A85 \1A86 \1A87 \1A88 \1A89; } @counter-style lanna-tham { system: numeric; symbols: '\1A90' '\1A91' '\1A92' '\1A93' '\1A94' '\1A95' '\1A96' '\1A97' '\1A98' '\1A99'; } /* LAO */ @counter-style lao { system: numeric; symbols: '\ED0' '\ED1' '\ED2' '\ED3' '\ED4' '\ED5' '\ED6' '\ED7' '\ED8' '\ED9'; } /* LATIN */ @counter-style lower-alpha { system: alphabetic; symbols: '\61' '\62' '\63' '\64' '\65' '\66' '\67' '\68' '\69' '\6A' '\6B' '\6C' '\6D' '\6E' '\6F' '\70' '\71' '\72' '\73' '\74' '\75' '\76' '\77' '\78' '\79' '\7A'; } @counter-style upper-alpha { system: alphabetic; symbols: '\41' '\42' '\43' '\44' '\45' '\46' '\47' '\48' '\49' '\4A' '\4B' '\4C' '\4D' '\4E' '\4F' '\50' '\51' '\52' '\53' '\54' '\55' '\56' '\57' '\58' '\59' '\5A'; } @counter-style fullwidth-lower-alpha { system: alphabetic; symbols: '\FF41' '\FF42' '\FF43' '\FF44' '\FF45' '\FF46' '\FF47' '\FF48' '\FF49' '\FF4A' '\FF4B' '\FF4C' '\FF4D' '\FF4E' '\FF4F' '\FF50' '\FF51' '\FF52' '\FF53' '\FF54' '\FF55' '\FF56' '\FF57' '\FF58' '\FF59' '\FF5A'; suffix: '\FF0E'; } @counter-style fullwidth-upper-alpha { system: alphabetic; symbols: '\FF21' '\FF22' '\FF23' '\FF24' '\FF25' '\FF26' '\FF27' '\FF28' '\FF29' '\FF2A' '\FF2B' '\FF2C' '\FF2D' '\FF2E' '\FF2F' '\FF30' '\FF31' '\FF32' '\FF33' '\FF34' '\FF35' '\FF36' '\FF37' '\FF38' '\FF39' '\FF3A'; suffix: '\FF0E'; } @counter-style lower-alpha-symbolic { system: symbolic; symbols: '\61' '\62' '\63' '\64' '\65' '\66' '\67' '\68' '\69' '\6A' '\6B' '\6C' '\6D' '\6E' '\6F' '\70' '\71' '\72' '\73' '\74' '\75' '\76' '\77' '\78' '\79' '\7A'; } @counter-style upper-alpha-symbolic { system: symbolic; symbols: '\41' '\42' '\43' '\44' '\45' '\46' '\47' '\48' '\49' '\4A' '\4B' '\4C' '\4D' '\4E' '\4F' '\50' '\51' '\52' '\53' '\54' '\55' '\56' '\57' '\58' '\59' '\5A'; } @counter-style lower-oromo-qubee { system: alphabetic; symbols: '\61' '\61\61' '\62' '\63' '\64' '\65' '\65\65' '\66' '\67' '\68' '\69' '\69\69' '\6A' '\6B' '\6C' '\6D' '\6E' '\6F' '\6F\6F' '\70' '\71' '\72' '\73' '\74' '\75' '\75\75' '\76' '\77' '\78' '\79' '\7A' '\63\68' '\64\68' '\6B\68' '\6E\79' '\70\68' '\73\68'; } @counter-style upper-oromo-qubee { system: alphabetic; symbols: '\41' '\41\41' '\42' '\43' '\44' '\45' '\45\45' '\46' '\47' '\48' '\49' '\49\49' '\4A' '\4B' '\4C' '\4D' '\4E' '\4F' '\4F\4F' '\50' '\51' '\52' '\53' '\54' '\55' '\55\55' '\56' '\57' '\58' '\59' '\5A' '\43\48' '\44\48' '\4B\48' '\4E\59' '\50\48' '\53\48'; } @counter-style parenthesized-lower-latin { system: fixed; symbols: '\249C' '\249D' '\249E' '\249F' '\24A0' '\24A1' '\24A2' '\24A3' '\24A4' '\24A5' '\24A6' '\24A7' '\24A8' '\24A9' '\24AA' '\24AB' '\24AC' '\24AD' '\24AE' '\24AF' '\24B0' '\24B1' '\24B2' '\24B3' '\24B4' '\24B5'; suffix: ' '; } /* LEPCHA */ @counter-style lepcha { system: numeric; symbols: '\1C40' '\1C41' '\1C42' '\1C43' '\1C44' '\1C45' '\1C46' '\1C47' '\1C48' '\1C49'; } /* LIMBU */ @counter-style limbu { system: numeric; symbols: \1946 \1947 \1948 \1949 \194A \194B \194C \194D \194E \194F ; } /* MALAYALAM */ @counter-style malayalam { system: numeric; symbols: '\D66' '\D67' '\D68' '\D69' '\D6A' '\D6B' '\D6C' '\D6D' '\D6E' '\D6F'; } @counter-style malayalam-alpha { system: alphabetic; symbols: '\D15' '\D7F' '\D16' '\D17' '\D18' '\D19' '\D1A''\D1B' '\D1C' '\D1D' '\D1E' '\D1F' '\D20' '\D21' '\D22' '\D23' '\D7A' '\D24' '\D25' '\D26' '\D27' '\D28' '\D7B' '\D2A' '\D2B' '\D2C' '\D2D' '\D2E' '\D2F' '\D30' '\D7C' '\D32' '\D7D' '\D35' '\D36' '\D37' '\D38' '\D39' '\D33' '\D7E' '\D34' '\D31' ; prefix: '('; suffix: ') '; } /* MMEETEI */ @counter-style meetei { system: numeric; symbols: '\ABF0' '\ABF1' '\ABF2' '\ABF3' '\ABF4' '\ABF5' '\ABF6' '\ABF7' '\ABF8' '\ABF9'; suffix: ') '; } @counter-style manipuri { system: alphabetic; symbols: '\ABC0' '\ABC1' '\ABC2' '\ABC3' '\ABC4' '\ABC5' '\ABC6' '\ABC7' '\ABC8' '\ABC9' '\ABCA' '\ABCB' '\ABCC' '\ABCD' '\ABCE' '\ABCF' '\ABD0' '\ABD1' '\ABD2' '\ABD3' '\ABD4' '\ABD5' '\ABD6' '\ABD7' '\ABD8' '\ABD9' '\ABDA' ; } /* MONGOLIAN */ @counter-style mongolian { system: numeric; symbols: '\1810' '\1811' '\1812' '\1813' '\1814' '\1815' '\1816' '\1817' '\1818' '\1819'; } /* MRO */ @counter-style mro { system: numeric; symbols: \016A60 \016A61 \016A62 \016A63 \016A64 \016A65 \016A66 \016A67 \016A68 \016A69 ; } /* MYANMAR */ @counter-style myanmar { system: numeric; symbols: '\1040' '\1041' '\1042' '\1043' '\1044' '\1045' '\1046' '\1047' '\1048' '\1049'; prefix: '('; suffix: ') '; } @counter-style shan { system: numeric; symbols: '\1090' '\1091' '\1092' '\1093' '\1094' '\1095' '\1096' '\1097' '\1098' '\1099'; prefix: '('; suffix: ') '; } /* N’KO */ @counter-style nko-cardinal { system: numeric; symbols: \07C1 \07C2 \07C3 \07C4 \07C5 \07C6 \07C7 \07C8 \07C9 \07C0; suffix: ' - '; } /* NAG MUNDARI */ @counter-style nag-mundari { system: numeric; symbols: '\01E4F0' '\01E4F1' '\01E4F2' '\01E4F3' '\01E4F4' '\01E4F5' '\01E4F6' '\01E4F7' '\01E4F8' '\01E4F9' ; } /* NEWA */ @counter-style newa { system: numeric; symbols: '\011450' '\011451' '\011452' '\011453' '\011454' '\011455' '\011456' '\011457' '\011458' '\011459' ; } /* OL CHIKI */ @counter-style ol-chiki { system: numeric; symbols: '\1C50' '\1C51' '\1C52' '\1C53' '\1C54' '\1C55' '\1C56' '\1C57' '\1C58' '\1C59'; suffix: '. '; } @counter-style santali { system: alphabetic; symbols: '\1C5A' '\1C5B' '\1C5C' '\1C5D' '\1C5E' '\1C5F' '\1C60' '\1C61' '\1C62' '\1C63' '\1C64' '\1C65' '\1C66' '\1C67' '\1C68' '\1C69' '\1C6A' '\1C6B' '\1C6C' '\1C6D' '\1C6E' '\1C6F' '\1C70' '\1C71' '\1C72' '\1C73' '\1C74' '\1C75' '\1C76' '\1C77' ; prefix: '('; suffix: ') '; } /* ORIYA */ @counter-style oriya { system: numeric; symbols: '\B66' '\B67' '\B68' '\B69' '\B6A' '\B6B' '\B6C' '\B6D' '\B6E' '\B6F'; } @counter-style odia { system: alphabetic; symbols: '\0B15' '\0B16' '\0B17' '\0B18' '\0B19' '\0B1A' '\0B1B' '\0B1C' '\0B1D' '\0B1E' '\0B1F' '\0B20' '\0B21' '\0B21\0B3C' '\0B22' '\0B22\0B3C' '\0B23' '\0B24' '\0B25' '\0B26' '\0B27' '\0B28' '\0B2A' '\0B2B' '\0B2C' '\0B2D' '\0B2E' '\0B2F' '\0B5F' '\0B30' '\0B32' '\0B33' '\0B71' '\0B36' '\0B37' '\0B38' '\0B39' ; prefix: '('; suffix: ') '; } /* SUNDANESE */ @counter-style sundanese { system: numeric; symbols: '\1BB0' '\1BB1' '\1BB2' '\1BB3' '\1BB4' '\1BB5' '\1BB6' '\1BB7' '\1BB8' '\1BB9'; } /* TAI LÜ */ @counter-style tai-lue { system: numeric; symbols: '\19D0' '\19D1' '\19D2' '\19D3' '\19D4' '\19D5' '\19D6' '\19D7' '\19D8' '\19D9'; } /* TAMIL */ @counter-style ancient-tamil { system: additive; range: 1 9999; additive-symbols: 9000 '\BEF\BF2', 8000 '\BEE\BF2', 7000 '\BED\BF2', 6000 '\BEC\BF2', 5000 '\BEB\BF2', 4000 '\BEA\BF2', 3000 '\BE9\BF2', 2000 '\BE8\BF2', 1000 '\BF2', 900 '\BEF\BF1', 800 '\BEE\BF1', 700 '\BED\BF1', 600 '\BEC\BF1', 500 '\BEB\BF1', 400 '\BEA\BF1', 300 '\BE9\BF1', 200 '\BE8\BF1', 100 '\BF1', 90 '\BEF\BF0', 80 '\BEE\BF0', 70 '\BED\BF0', 60 '\BEC\BF0', 50 '\BEB\BF0', 40 '\BEA\BF0', 30 '\BE9\BF0', 20 '\BE8\BF0', 10 '\BF0', 9 '\BEF', 8 '\BEE', 7 '\BED', 6 '\BEC', 5 '\BEB', 4 '\BEA', 3 '\BE9', 2 '\BE8', 1 '\BE7'; } @counter-style tamil { system: numeric; symbols: '\BE6' '\BE7' '\BE8' '\BE9' '\BEA' '\BEB' '\BEC' '\BED' '\BEE' '\BEF'; } /* TELUGU */ @counter-style telugu { system: numeric; symbols: '\C66' '\C67' '\C68' '\C69' '\C6A' '\C6B' '\C6C' '\C6D' '\C6E' '\C6F'; } @counter-style telugu-alpha { system: alphabetic; symbols: '\C15' '\C16' '\C17' '\C18' '\C19' '\C1A' '\C58' '\C1B' '\C1C' '\C1D' '\C1E' '\C1F' '\C20' '\C21' '\C22' '\C23' '\C24' '\C25' '\C26' '\C27' '\C28' '\C2A' '\C2B' '\C2C' '\C2D' '\C2E' '\C2F' '\C30' '\C31' '\C32' '\C33' '\C34' '\C35' '\C36' '\C37' '\C38' '\C39' ; suffix: ') '; } /* THAI */ @counter-style thai { system: numeric; symbols: '\E50' '\E51' '\E52' '\E53' '\E54' '\E55' '\E56' '\E57' '\E58' '\E59'; } @counter-style thai-alpha { system: alphabetic; symbols: '\E01' '\E02' '\E04' '\E07' '\E08' '\E09' '\E0A' '\E0B' '\E0C' '\E0D' '\E0E' '\E0F' '\E10' '\E11' '\E12' '\E13' '\E14' '\E15' '\E16' '\E17' '\E18' '\E19' '\E1A' '\E1B' '\E1C' '\E1D' '\E1E' '\E1F' '\E20' '\E21' '\E22' '\E23' '\E25' '\E27' '\E28' '\E29' '\E2A' '\E2B' '\E2C' '\E2D' '\E2E'; } /* TIBETAN */ @counter-style tibetan { system: numeric; symbols: '\F20' '\F21' '\F22' '\F23' '\F24' '\F25' '\F26' '\F27' '\F28' '\F29'; } /* WARANG CITI */ @counter-style warang-citi { system: numeric; symbols: '\118E0' '\118E1' '\118E2' '\118E3' '\118E4' '\118E5' '\118E6' '\118E7' '\118E8' '\118E9'; } /* DIGITS, ROMAN, ETC */ @counter-style binary { system: numeric; symbols: '\30' '\31'; } @counter-style tally-mark { system: additive; additive-symbols: 5 '\1D378', 1 '\1D377'; suffix: ' '; } @counter-style circled-decimal { system: fixed 0; symbols: '\24EA' '\2460' '\2461' '\2462' '\2463' '\2464' '\2465' '\2466' '\2467' '\2468' '\2469' '\246A' '\246B' '\246C' '\246D' '\246E' '\246F' '\2470' '\2471' '\2472' '\2473' '\3251' '\3252' '\3253' '\3254' '\3255' '\3256' '\3257' '\3258' '\3259' '\325a' '\325b' '\325c' '\325d' '\325e' '\325f' '\32b1' '\32b2' '\32b3' '\32b4' '\32b5' '\32b6' '\32b7' '\32b8' '\32b9' '\32ba' '\32bb' '\32bc' '\32bd' '\32be' '\32bf'; suffix: ' '; } @counter-style circled-lower-latin { system: fixed; symbols: '\24D0' '\24D1' '\24D2' '\24D3' '\24D4' '\24D5' '\24D6' '\24D7' '\24D8' '\24D9' '\24DA' '\24DB' '\24DC' '\24DD' '\24DE' '\24DF' '\24E0' '\24E1' '\24E2' '\24E3' '\24E4' '\24E5' '\24E6' '\24E7' '\24E8' '\24E9'; suffix: ' '; } @counter-style circled-upper-latin { system: fixed; symbols: '\24B6' '\24B7' '\24B8' '\24B9' '\24BA' '\24BB' '\24BC' '\24BD' '\24BE' '\24BF' '\24C0' '\24C1' '\24C2' '\24C3' '\24C4' '\24C5' '\24C6' '\24C7' '\24C8' '\24C9' '\24CA' '\24CB' '\24CC' '\24CD' '\24CE' '\24CF'; suffix: ' '; } @counter-style decimal { system: numeric; symbols: '\30' '\31' '\32' '\33' '\34' '\35' '\36' '\37' '\38' '\39'; } @counter-style decimal-leading-zero { system: fixed -9; symbols: '\2D\30\39' '\2D\30\38' '\2D\30\37' '\2D\30\36' '\2D\30\35' '\2D\30\34' '\2D\30\33' '\2D\30\32' '\2D\30\31' '\30\30' '\30\31' '\30\32' '\30\33' '\30\34' '\30\35' '\30\36' '\30\37' '\30\38' '\30\39'; } @counter-style dotted-decimal { system: fixed; symbols: '\2488' '\2489' '\248A' '\248B' '\248C' '\248D' '\248E' '\248F' '\2490' '\2491' '\2492' '\2493' '\2494' '\2495' '\2496' '\2497' '\2498' '\2499' '\249A' '\249B'; suffix: ' '; } @counter-style double-circled-decimal { system: fixed; symbols: '\24F5' '\24F6' '\24F7' '\24F8' '\24F9' '\24FA' '\24FB' '\24FC' '\24FD' '\24FE'; suffix: ' '; } @counter-style filled-circled-decimal { system: fixed; symbols: '\2776' '\2777' '\2778' '\2779' '\277a' '\277b' '\277c' '\277d' '\277e' '\277f' '\24EB' '\24EC' '\24ED' '\24EE' '\24EF' '\24F0' '\24F1' '\24F2' '\24F3' '\24F4'; suffix: ' '; } @counter-style fullwidth-decimal { system: numeric; symbols: '\FF10' '\FF11' '\FF12' '\FF13' '\FF14' '\FF15' '\FF16' '\FF17' '\FF18' '\FF19'; suffix: '\FF0E'; } @counter-style fullwidth-lower-roman { system: fixed; symbols: '\2170' '\2171' '\2172' '\2173' '\2174' '\2175' '\2176' '\2177' '\2178' '\2179' '\217A' '\217B'; suffix: ' '; } @counter-style fullwidth-upper-roman { system: fixed; symbols: '\2160' '\2161' '\2162' '\2163' '\2164' '\2165' '\2166' '\2167' '\2168' '\2169' '\216A' '\216B'; suffix: ' '; } @counter-style lower-hexadecimal { system: numeric; symbols: '\30' '\31' '\32' '\33' '\34' '\35' '\36' '\37' '\38' '\39' '\61' '\62' '\63' '\64' '\65' '\66'; } @counter-style lower-roman { system: additive; range: 1 3999; additive-symbols: 1000 '\6D', 900 '\63\6D', 500 '\64', 400 '\63\64', 100 '\63', 90 '\78\63', 50 '\6C', 40 '\78\6C', 10 '\78', 9 '\69\78', 5 '\76', 4 '\69\76', 1 '\69'; } @counter-style new-base-60 { system: numeric; symbols: '\30' '\31' '\32' '\33' '\34' '\35' '\36' '\37' '\38' '\39' '\41' '\42' '\43' '\44' '\45' '\46' '\47' '\48' '\4A' '\4B' '\4C' '\4D' '\4E' '\50' '\51' '\52' '\53' '\54' '\55' '\56' '\57' '\58' '\59' '\5A' '\5F' '\61' '\62' '\63' '\64' '\65' '\66' '\67' '\68' '\69' '\6A' '\6B' '\6D' '\6E' '\6F' '\70' '\71' '\72' '\73' '\74' '\75' '\76' '\77' '\78' '\79' '\7A'; } @counter-style octal { system: numeric; symbols: '\30' '\31' '\32' '\33' '\34' '\35' '\36' '\37'; } @counter-style parenthesized-decimal { system: fixed; symbols: '\2474' '\2475' '\2476' '\2477' '\2478' '\2479' '\247A' '\247B' '\247C' '\247D' '\247E' '\247F' '\2480' '\2481' '\2482' '\2483' '\2484' '\2485' '\2486' '\2487'; suffix: ' '; } @counter-style simple-lower-roman { system: additive; range: 1 4999; additive-symbols: 1000 '\6D', 500 '\64', 100 '\63', 50 '\6C', 10 '\78', 5 '\76', 1 '\69'; } @counter-style simple-upper-roman { system: additive; range: 1 4999; additive-symbols: 1000 '\4D', 500 '\44', 100 '\43', 50 '\4C', 10 '\58', 5 '\56', 1 '\49'; } @counter-style super-decimal { system: numeric; symbols: '\2070' '\B9' '\B2' '\B3' '\2074' '\2075' '\2076' '\2077' '\2078' '\2079'; } @counter-style upper-hexadecimal { system: numeric; symbols: '\30' '\31' '\32' '\33' '\34' '\35' '\36' '\37' '\38' '\39' '\41' '\42' '\43' '\44' '\45' '\46'; } @counter-style upper-roman { system: additive; range: 1 3999; additive-symbols: 1000 '\4D', 900 '\43\4D', 500 '\44', 400 '\43\44', 100 '\43', 90 '\58\43', 50 '\4C', 40 '\58\4C', 10 '\58', 9 '\49\58', 5 '\56', 4 '\49\56', 1 '\49'; } </style> <script src="code.js"></script> <meta name="color-scheme" content="light"> <meta name="description" content="This document provides ready-made definitions for counter styles and covers the needs of a range of cultures around the world. The code snippets provided in the document can be included in style declarations by simply copying and pasting, or they can be use as a starting point and modified as desired."> <link rel="canonical" href="https://www.w3.org/TR/predefined-counter-styles/"> <style> .hljs{--base:#fafafa;--mono-1:#383a42;--mono-2:#686b77;--mono-3:#717277;--hue-1:#0b76c5;--hue-2:#336ae3;--hue-3:#a626a4;--hue-4:#42803c;--hue-5:#ca4706;--hue-5-2:#c91243;--hue-6:#986801;--hue-6-2:#9a6a01} @media (prefers-color-scheme:dark){ .hljs{--base:#282c34;--mono-1:#abb2bf;--mono-2:#818896;--mono-3:#5c6370;--hue-1:#56b6c2;--hue-2:#61aeee;--hue-3:#c678dd;--hue-4:#98c379;--hue-5:#e06c75;--hue-5-2:#be5046;--hue-6:#d19a66;--hue-6-2:#e6c07b} } .hljs{display:block;overflow-x:auto;padding:.5em;color:#383a42;color:var(--mono-1,#383a42);background:#fafafa;background:var(--base,#fafafa)} .hljs-comment,.hljs-quote{color:#717277;color:var(--mono-3,#717277);font-style:italic} .hljs-doctag,.hljs-formula,.hljs-keyword{color:#a626a4;color:var(--hue-3,#a626a4)} .hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#ca4706;color:var(--hue-5,#ca4706);font-weight:700} .hljs-literal{color:#0b76c5;color:var(--hue-1,#0b76c5)} .hljs-addition,.hljs-attribute,.hljs-meta-string,.hljs-regexp,.hljs-string{color:#42803c;color:var(--hue-4,#42803c)} .hljs-built_in,.hljs-class .hljs-title{color:#9a6a01;color:var(--hue-6-2,#9a6a01)} .hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#986801;color:var(--hue-6,#986801)} .hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#336ae3;color:var(--hue-2,#336ae3)} .hljs-emphasis{font-style:italic} .hljs-strong{font-weight:700} .hljs-link{text-decoration:underline} </style> <style> var{position:relative;cursor:pointer} var[data-type]::after,var[data-type]::before{position:absolute;left:50%;top:-6px;opacity:0;transition:opacity .4s;pointer-events:none} var[data-type]::before{content:"";transform:translateX(-50%);border-width:4px 6px 0 6px;border-style:solid;border-color:transparent;border-top-color:#222} var[data-type]::after{content:attr(data-type);transform:translateX(-50%) translateY(-100%);background:#222;text-align:center;font-family:"Dank Mono","Fira Code",monospace;font-style:normal;padding:6px;border-radius:3px;color:#daca88;text-indent:0;font-weight:400} var[data-type]:hover::after,var[data-type]:hover::before{opacity:1} </style> <script id="initialUserConfig" type="application/json">{ "specStatus": "NOTE", "noRecTrack": true, "shortName": "predefined-counter-styles", "copyrightStart": "2014", "edDraftURI": "https://w3c.github.io/predefined-counter-styles/", "editors": [ { "name": "Richard Ishida", "url": "", "company": "W3C", "companyURL": "", "w3cid": 3439 } ], "group": "i18n", "github": "w3c/predefined-counter-styles", "publishDate": "2024-08-15", "publishISODate": "2024-08-15T00:00:00.000Z", "generatedSubtitle": "W3C Group Note 15 August 2024" }</script> <link rel="stylesheet" href="https://www.w3.org/StyleSheets/TR/2021/W3C-NOTE"></head> <body class="h-entry informative"><div class="head"> <p class="logos"><a class="logo" href="https://www.w3.org/"><img crossorigin="" alt="W3C" height="48" src="https://www.w3.org/StyleSheets/TR/2021/logos/W3C" width="72"> </a></p> <h1 id="title" class="title">Ready-made Counter Styles</h1> <p id="w3c-state"><a href="https://www.w3.org/standards/types#NOTE">W3C Group Note</a> <time class="dt-published" datetime="2024-08-15">15 August 2024</time></p> <details open=""> <summary>More details about this document</summary> <dl> <dt>This version:</dt><dd> <a class="u-url" href="https://www.w3.org/TR/2024/NOTE-predefined-counter-styles-20240815/">https://www.w3.org/TR/2024/NOTE-predefined-counter-styles-20240815/</a> </dd> <dt>Latest published version:</dt><dd> <a href="https://www.w3.org/TR/predefined-counter-styles/">https://www.w3.org/TR/predefined-counter-styles/</a> </dd> <dt>Latest editor's draft:</dt><dd><a href="https://w3c.github.io/predefined-counter-styles/">https://w3c.github.io/predefined-counter-styles/</a></dd> <dt>History:</dt><dd> <a href="https://www.w3.org/standards/history/predefined-counter-styles/">https://www.w3.org/standards/history/predefined-counter-styles/</a> </dd><dd> <a href="https://github.com/w3c/predefined-counter-styles/commits/">Commit history</a> </dd> <dt>Editor:</dt><dd class="editor p-author h-card vcard" data-editor-id="3439"> <span class="p-name fn">Richard Ishida</span> (<span class="p-org org h-org">W3C</span>) </dd> <dt>Feedback:</dt><dd> <a href="https://github.com/w3c/predefined-counter-styles/">GitHub w3c/predefined-counter-styles</a> (<a href="https://github.com/w3c/predefined-counter-styles/pulls/">pull requests</a>, <a href="https://github.com/w3c/predefined-counter-styles/issues/new/choose">new issue</a>, <a href="https://github.com/w3c/predefined-counter-styles/issues/">open issues</a>) </dd> </dl> </details> <p class="copyright"> <a href="https://www.w3.org/policies/#copyright">Copyright</a> © 2014-2024 <a href="https://www.w3.org/">World Wide Web Consortium</a>. <abbr title="World Wide Web Consortium">W3C</abbr><sup>®</sup> <a href="https://www.w3.org/policies/#Legal_Disclaimer">liability</a>, <a href="https://www.w3.org/policies/#W3C_Trademarks">trademark</a> and <a rel="license" href="https://www.w3.org/copyright/software-license-2023/" title="W3C Software and Document Notice and License">permissive document license</a> rules apply. </p> <hr title="Separator for header"> </div> <section id="abstract" class="introductory"><h2>Abstract</h2> <p>This document provides ready-made definitions for counter styles and covers the needs of a range of cultures around the world. The code snippets provided in the document can be included in style declarations by simply copying and pasting, or they can be use as a starting point and modified as desired.</p> </section> <div id="sotd" class="introductory"><h2>Status of This Document</h2><p><em>This section describes the status of this document at the time of its publication. A list of current <abbr title="World Wide Web Consortium">W3C</abbr> publications and the latest revision of this technical report can be found in the <a href="https://www.w3.org/TR/"><abbr title="World Wide Web Consortium">W3C</abbr> technical reports index</a> at https://www.w3.org/TR/.</em></p> <p>This document describes counter styles used by various cultures around the world and can be used as a reference for those wishing to define user-defined counter styles for CSS. The content of this document was originally part of the CSS Lists and Counters specification, but is now published as a standalone document by the <abbr title="World Wide Web Consortium">W3C</abbr> Internationalization Working Group. It is expected that the document will be updated from time to time to include new information.</p> <p> This document was published by the <a href="https://www.w3.org/groups/wg/i18n-core">Internationalization Working Group</a> as a Group Note using the <a href="https://www.w3.org/policies/process/20231103/#recs-and-notes">Note track</a>. </p><p>This Group Note is endorsed by the <a href="https://www.w3.org/groups/wg/i18n-core">Internationalization Working Group</a>, but is not endorsed by <abbr title="World Wide Web Consortium">W3C</abbr> itself nor its Members. </p><p> This is a draft document and may be updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress. </p><p data-deliverer="32113"> The <a href="https://www.w3.org/policies/patent-policy/"><abbr title="World Wide Web Consortium">W3C</abbr> Patent Policy</a> does not carry any licensing requirements or commitments on this document. </p><p> This document is governed by the <a id="w3c_process_revision" href="https://www.w3.org/policies/process/20231103/">03 November 2023 <abbr title="World Wide Web Consortium">W3C</abbr> Process Document</a>. </p></div><nav id="toc"><h2 class="introductory" id="table-of-contents">Table of Contents</h2><ol class="toc"><li class="tocline"><a class="tocxref" href="#abstract">Abstract</a></li><li class="tocline"><a class="tocxref" href="#intro"><bdi class="secno">1. </bdi>Introduction</a><ol class="toc"><li class="tocline"><a class="tocxref" href="#affixes"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a></li><li class="tocline"><a class="tocxref" href="#tips"><bdi class="secno">1.2 </bdi>Things to remember</a></li><li class="tocline"><a class="tocxref" href="#builtins"><bdi class="secno">1.3 </bdi>Show built-in style tests</a></li></ol></li><li class="tocline"><a class="tocxref" href="#adlam-styles"><bdi class="secno">2. </bdi>Adlam</a></li><li class="tocline"><a class="tocxref" href="#arabic-styles"><bdi class="secno">3. </bdi>Arabic</a></li><li class="tocline"><a class="tocxref" href="#armenian-styles"><bdi class="secno">4. </bdi>Armenian</a></li><li class="tocline"><a class="tocxref" href="#balinese-styles"><bdi class="secno">5. </bdi>Balinese</a></li><li class="tocline"><a class="tocxref" href="#bamum-styles"><bdi class="secno">6. </bdi>Bamum</a></li><li class="tocline"><a class="tocxref" href="#bengali-styles"><bdi class="secno">7. </bdi>Bengali</a></li><li class="tocline"><a class="tocxref" href="#bopomofo-styles"><bdi class="secno">8. </bdi>Bopomofo</a></li><li class="tocline"><a class="tocxref" href="#cyrillic-styles"><bdi class="secno">9. </bdi>Cyrillic</a></li><li class="tocline"><a class="tocxref" href="#devanagari-styles"><bdi class="secno">10. </bdi>Devanagari</a></li><li class="tocline"><a class="tocxref" href="#ethiopic-styles"><bdi class="secno">11. </bdi>Ethiopic</a></li><li class="tocline"><a class="tocxref" href="#georgian-styles"><bdi class="secno">12. </bdi>Georgian</a></li><li class="tocline"><a class="tocxref" href="#greek-styles"><bdi class="secno">13. </bdi>Greek</a></li><li class="tocline"><a class="tocxref" href="#gujarati-styles"><bdi class="secno">14. </bdi>Gujarati</a></li><li class="tocline"><a class="tocxref" href="#gurmukhi-styles"><bdi class="secno">15. </bdi>Gurmukhi</a></li><li class="tocline"><a class="tocxref" href="#rohingya-styles"><bdi class="secno">16. </bdi>Hanifi Rohingya</a></li><li class="tocline"><a class="tocxref" href="#hebrew-styles"><bdi class="secno">17. </bdi>Hebrew</a></li><li class="tocline"><a class="tocxref" href="#chinese-styles"><bdi class="secno">18. </bdi>Han & <abbr title="Chinese/Japanese/Korean">CJK</abbr></a></li><li class="tocline"><a class="tocxref" href="#kana-styles"><bdi class="secno">19. </bdi>Japanese</a></li><li class="tocline"><a class="tocxref" href="#javanese-styles"><bdi class="secno">20. </bdi>Javanese</a></li><li class="tocline"><a class="tocxref" href="#kannada-styles"><bdi class="secno">21. </bdi>Kannada</a></li><li class="tocline"><a class="tocxref" href="#kayah-li-styles"><bdi class="secno">22. </bdi>Kayah Li</a></li><li class="tocline"><a class="tocxref" href="#khmer-styles"><bdi class="secno">23. </bdi>Khmer</a></li><li class="tocline"><a class="tocxref" href="#korean-styles"><bdi class="secno">24. </bdi>Korean</a></li><li class="tocline"><a class="tocxref" href="#lanna-styles"><bdi class="secno">25. </bdi>Lanna (Tai Tham)</a></li><li class="tocline"><a class="tocxref" href="#lao-styles"><bdi class="secno">26. </bdi>Lao</a></li><li class="tocline"><a class="tocxref" href="#latin-styles"><bdi class="secno">27. </bdi>Latin</a></li><li class="tocline"><a class="tocxref" href="#lepcha-styles"><bdi class="secno">28. </bdi>Lepcha</a></li><li class="tocline"><a class="tocxref" href="#limbu-styles"><bdi class="secno">29. </bdi>Limbu</a></li><li class="tocline"><a class="tocxref" href="#malayalam-styles"><bdi class="secno">30. </bdi>Malayalam</a></li><li class="tocline"><a class="tocxref" href="#meetei-styles"><bdi class="secno">31. </bdi>Meetei</a></li><li class="tocline"><a class="tocxref" href="#mongolian-styles"><bdi class="secno">32. </bdi>Mongolian</a></li><li class="tocline"><a class="tocxref" href="#mro-styles"><bdi class="secno">33. </bdi>Mro</a></li><li class="tocline"><a class="tocxref" href="#myanmar-styles"><bdi class="secno">34. </bdi>Myanmar (Burmese)</a></li><li class="tocline"><a class="tocxref" href="#nko-styles"><bdi class="secno">35. </bdi>N’Ko</a></li><li class="tocline"><a class="tocxref" href="#nag-mundari-styles"><bdi class="secno">36. </bdi>Nag Mundari</a></li><li class="tocline"><a class="tocxref" href="#newa-styles"><bdi class="secno">37. </bdi>Newa</a></li><li class="tocline"><a class="tocxref" href="#ol-chiki-styles"><bdi class="secno">38. </bdi>Ol Chiki</a></li><li class="tocline"><a class="tocxref" href="#oriya-styles"><bdi class="secno">39. </bdi>Oriya</a></li><li class="tocline"><a class="tocxref" href="#sundanese-styles"><bdi class="secno">40. </bdi>Sundanese</a></li><li class="tocline"><a class="tocxref" href="#tailue-styles"><bdi class="secno">41. </bdi>Tai Lü</a></li><li class="tocline"><a class="tocxref" href="#tamil-styles"><bdi class="secno">42. </bdi>Tamil</a></li><li class="tocline"><a class="tocxref" href="#telugu-styles"><bdi class="secno">43. </bdi>Telugu</a></li><li class="tocline"><a class="tocxref" href="#thai-styles"><bdi class="secno">44. </bdi>Thai</a></li><li class="tocline"><a class="tocxref" href="#tibetan-styles"><bdi class="secno">45. </bdi>Tibetan</a></li><li class="tocline"><a class="tocxref" href="#warangciti-styles"><bdi class="secno">46. </bdi>Warang Citi</a></li><li class="tocline"><a class="tocxref" href="#digit-styles"><bdi class="secno">47. </bdi>European Digits, Roman, etc.</a></li><li class="tocline"><a class="tocxref" href="#app-c"><bdi class="secno">A. </bdi> Revision Log</a></li><li class="tocline"><a class="tocxref" href="#acknowledgements"><bdi class="secno">B. </bdi>Acknowledgements</a></li><li class="tocline"><a class="tocxref" href="#references"><bdi class="secno">C. </bdi>References</a><ol class="toc"><li class="tocline"><a class="tocxref" href="#informative-references"><bdi class="secno">C.1 </bdi>Informative references</a></li></ol></li></ol></nav> <section id="intro"><div class="header-wrapper"><h2 id="x1-introduction"><bdi class="secno">1. </bdi>Introduction</h2><a class="self-link" href="#intro" aria-label="Permalink for Section 1."></a></div> <p> Browsers that implement the <a href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a> specification provide a mechanism for authors to create user-defined counter styles for use with CSS list-markers and generated-content counters. </p> <p>As a content author, unless the counter style you want to use is one of a small set that are predefined in the specification, you yourself will need to define how it works in your style sheet. To make it easier for you, this document provides code snippets that people have already worked out for a large set of user-defined and predefined styles, covering more than 45 writing systems around the world. The total number of styles is <span id="stats">181</span>.</p> <p>If you find what you are looking for, you can simply cut and paste the style you need into your stylesheet. Click on the <img src="copy.svg" alt="Copy icon" style="height:1em;"> icon to copy the template to your clipboard. Alternatively, you can use the styles here for inspiration, or adapt them to suit your preferences.</p> <p>For example, the following CSS code defines the <code class="kw" translate="no">arabic-indic</code> counter style, then applies it to ordered lists using the <code class="kw" translate="no">list-style-type</code> property.</p> <div class="example"> <pre aria-busy="false"><code class="hljs css"><span class="hljs-keyword">@counter-style</span> arabic-indic { system: numeric; symbols: <span class="hljs-string">'\660'</span> <span class="hljs-string">'\661'</span> <span class="hljs-string">'\662'</span> <span class="hljs-string">'\663'</span> <span class="hljs-string">'\664'</span> <span class="hljs-string">'\665'</span> <span class="hljs-string">'\666'</span> <span class="hljs-string">'\667'</span> <span class="hljs-string">'\668'</span> <span class="hljs-string">'\669'</span>; <span class="hljs-comment">/* symbols: '٠' '١' '٢' '٣' '٤' '٥' '٦' '٧' '٨' '٩'; */</span> } <span class="hljs-selector-tag">ol</span> { <span class="hljs-attribute">list-style-type</span>: arabic-indic; }</code></pre> </div> <p>The <a href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a> specification includes a number of predefined counter-styles for which browsers are expected to implement built-in support. The definitions of those styles are also included here, for ease of reference, and identified as such by a note. Click on the <img src="compat.svg" alt="Compatibility icon" style="height:1em;"> icon to go to the MDN page for <code class="kw" translate="no">list-style-type</code>, which has indications of which styles are supported by browsers.</p> <p>We try to only include in this document counter styles that are in regular use in the wild, and we are particularly interested in supporting the needs of people who use non-Latin scripts. You may find more experimental or new templates on other sites, such as that <a href="https://github.com/Crissov/css-counters">provided by Christoph Päper</a>.</p> <section id="affixes"><div class="header-wrapper"><h3 id="x1-1-adapting-prefixes-suffixes"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</h3><a class="self-link" href="#affixes" aria-label="Permalink for Section 1.1"></a></div> <p>The likelihood that you will need to customise the basic counter symbols in the styles provided here is low. However, there is a much higher likelihood that you will want to vary the affixes (prefix and/or suffix) associated with counters. For example, counters used for numbering headings may look better as just the bare counter, whereas in lists the counter may be following by a period+space, be surrounded by parentheses, or be followed by a script-specific delimiter, etc. In fact, different strategies may be used on the same page, depending on the level of nesting or the context in which the list is used.</p> <p>For the styles shown here we apply a common default. (Often, none is specified, which will result in a period+space suffix.) If you want a different affix you should make the appropriate change. Code for some common alternatives is given in the panel just below.</p> <div class="example" id="standard_alt_prefix_suffix"> <p>Space-only suffixes need to be explicitly defined as follows:</p> <pre translate="no" aria-busy="false"><code class="hljs css">suffix: <span class="hljs-string">' '</span>;</code></pre> <p>Counters in parentheses need to have both prefix and suffix defined:</p> <pre translate="no" aria-busy="false"><code class="hljs css">prefix: <span class="hljs-string">'('</span>; suffix: <span class="hljs-string">') '</span>;</code></pre> </div> <p>Notes are used to describe alternative affixes for a given style, and where they involve a non-ASCII character or some other special arrangement, suggested code is provided.</p> <div class="example" id="native_alt_prefix_suffix"> <p>For example, Myanmar may use <span class="codepoint" translate="no"><span lang="my">။</span> [<span class="uname">U+104B MYANMAR SIGN SECTION</span>]</span> as a suffix, so the Myanmar section includes:</p> <pre translate="no" aria-busy="false"><code class="hljs css">suffix: <span class="hljs-string">'။ '</span>;</code></pre> </div> <p>If you want to provide multiple alternative affix declarations for a given counter style, you will find it most effective to add another style using the standard extension mechanism.</p> <div class="example" id="extensions"> <p>For example, the following defines two styles for Myanmar that differ only in the prefix/suffix used. Either style can be used for a given list just by specifying the appropriate name.</p> <pre translate="no" aria-busy="false"><code class="hljs css"> <span class="hljs-keyword">@counter-style</span> myanmar { system: numeric; symbols: <span class="hljs-string">'၀'</span> <span class="hljs-string">'၁'</span> <span class="hljs-string">'၂'</span> <span class="hljs-string">'၃'</span> <span class="hljs-string">'၄'</span> <span class="hljs-string">'၅'</span> <span class="hljs-string">'၆'</span> <span class="hljs-string">'၇'</span> <span class="hljs-string">'၈'</span> <span class="hljs-string">'၉'</span>; prefix: <span class="hljs-string">'('</span>; suffix: <span class="hljs-string">') '</span>; } <span class="hljs-keyword">@counter-style</span> myanmar-section { system: extends myanmar; prefix: <span class="hljs-string">''</span>; suffix: <span class="hljs-string">"။ "</span>; } <span class="hljs-selector-tag">ol</span> { <span class="hljs-attribute">list-style-type</span>: myanmar; } <span class="hljs-selector-id">#toc</span> <span class="hljs-selector-tag">ol</span> { <span class="hljs-attribute">list-style-type</span>: myanmar-section; } </code></pre> </div> </section> <section id="tips"><div class="header-wrapper"><h3 id="x1-2-things-to-remember"><bdi class="secno">1.2 </bdi>Things to remember</h3><a class="self-link" href="#tips" aria-label="Permalink for Section 1.2"></a></div> <ol> <li> <p>At the time of writing, the CSS Counter Styles Level 3 specification is still in the Candidate Recommendation phase. Custom counter styles are not yet <a href="https://github.com/w3c/iip/issues/93">supported in all browsers</a>. See a <a href="https://w3c.github.io/i18n-tests/results/counter-styles">set of basic tests</a> to find which browsers support this feature. On browsers that don't support custom counter styles, the counter styles will fall back to the default.</p> <p>Many of the styles described here are already supported by name in browsers. See <a href="https://w3c.github.io/i18n-tests/results/custom-counter-styles">the tests for a list of what international styles are supported</a> natively by which browsers.</p> </li> <li> <p>You can call these styles or the ones you invent yourself by whatever name you prefer. For example, if you prefer to call the <code class="kw" translate="no">persian</code> counter style <code class="kw" translate="no">extended-arabic</code>, you can just change the name of the counter style. Bear in mind, however, that a counter style called <code class="kw" translate="no">persian</code> may be supported by browsers that don't support <code class="kw" translate="no">@counter-style</code>, so using standard names can sometimes be beneficial.</p></li> <li><p>The Internationalization Working Group expects this document to be updated from time to time as new information or corrections are added. If you wish to propose new information to be included here, please <a href="https://github.com/w3c/predefined-counter-styles/issues">raise an issue in github</a>.</p> <p>However, before submitting a counter-style template for inclusion, please gather evidence that it is actually in use in the wild. For example, it is easy to conceive different alphabetic lists that correspond to various European languages, but we haven't yet seen good evidence that such lists are used widely, and so they are not included here. You should also provide a counter style definition for a template you'd like to see included.</p></li> </ol> </section> <section id="builtins"><div class="header-wrapper"><h3 id="x1-3-show-built-in-style-tests"><bdi class="secno">1.3 </bdi>Show built-in style tests</h3><a class="self-link" href="#builtins" aria-label="Permalink for Section 1.3"></a></div> <p>By clicking this button you will remove all counter-style declarations from the document. Counter styles that remain are those supported by the browser. To reinstate the custom counter styles, refresh the document.</p> <p><button onclick="styleElements=document.querySelectorAll('.cs'); for (i=0;i<styleElements.length;i++) styleElements[i].innerHTML = '';">Hide CS declarations</button></p> </section> </section> <dialog id="copyNotice">Copied !</dialog> <section id="adlam-styles"><div class="header-wrapper"><h2 id="x2-adlam"><bdi class="secno">2. </bdi>Adlam</h2><a class="self-link" href="#adlam-styles" aria-label="Permalink for Section 2."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('adlam')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="adlam"><a href="#adlam">adlam</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style adlam { system: numeric; symbols: '\01E950' '\01E951' '\01E952' '\01E953' '\01E954' '\01E955' '\01E956' '\01E957' '\01E958' '\01E959'; /* symbols: '𞥐' '𞥑' '𞥒' '𞥓' '𞥔' '𞥕' '𞥖' '𞥗' '𞥘' '𞥙'; */ } </bdo></code></p> <div id="out_adlam" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="fuf" style="list-style-type: adlam; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="fuf" style="list-style-type: adlam; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="fuf" style="list-style-type: adlam;"><li>11</li></ol> <ol start="22" class="high" lang="fuf" style="list-style-type: adlam;"><li>22</li></ol> <ol start="33" class="high" lang="fuf" style="list-style-type: adlam;"><li>33</li></ol> <ol start="44" class="high" lang="fuf" style="list-style-type: adlam;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="fuf" style="list-style-type: adlam;"><li>111</li></ol> <ol start="222" class="high" lang="fuf" style="list-style-type: adlam;"><li>222</li></ol> <ol start="333" class="high" lang="fuf" style="list-style-type: adlam;"><li>333</li></ol> <ol start="444" class="high" lang="fuf" style="list-style-type: adlam;"><li>444</li></ol></div> </div></div> <script>addExamples('adlam', 'fuf', 'rtl')</script> </div> </section> <section id="arabic-styles"><div class="header-wrapper"><h2 id="x3-arabic"><bdi class="secno">3. </bdi>Arabic</h2><a class="self-link" href="#arabic-styles" aria-label="Permalink for Section 3."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('arabic-indic')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="arabic-indic"><a href="#arabic-indic">arabic-indic</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style arabic-indic { system: numeric; symbols: '\660' '\661' '\662' '\663' '\664' '\665' '\666' '\667' '\668' '\669'; /* symbols: '٠' '١' '٢' '٣' '٤' '٥' '٦' '٧' '٨' '٩'; */ } </bdo></code></p> <div id="out_arabic-indic" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="ar" style="list-style-type: arabic-indic; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ar" style="list-style-type: arabic-indic; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ar" style="list-style-type: arabic-indic;"><li>11</li></ol> <ol start="22" class="high" lang="ar" style="list-style-type: arabic-indic;"><li>22</li></ol> <ol start="33" class="high" lang="ar" style="list-style-type: arabic-indic;"><li>33</li></ol> <ol start="44" class="high" lang="ar" style="list-style-type: arabic-indic;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ar" style="list-style-type: arabic-indic;"><li>111</li></ol> <ol start="222" class="high" lang="ar" style="list-style-type: arabic-indic;"><li>222</li></ol> <ol start="333" class="high" lang="ar" style="list-style-type: arabic-indic;"><li>333</li></ol> <ol start="444" class="high" lang="ar" style="list-style-type: arabic-indic;"><li>444</li></ol></div> </div></div> <script>addExamples('arabic-indic', 'ar', 'rtl')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('arabic-abjad')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="arabic-abjad"><a href="#arabic-abjad">arabic-abjad</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style arabic-abjad { system: fixed; symbols: '\627' '\628' '\62C' '\62F' '\647\200D' '\648' '\632' '\62D' '\637' '\64A' '\643' '\644' '\645' '\646' '\633' '\639' '\641' '\635' '\642' '\631' '\634' '\62A' '\62B' '\62E' '\630' '\636' '\638' '\63A'; /* symbols: 'ا' 'ب' 'ج' 'د' 'ه‍' 'و' 'ز' 'ح' 'ط' 'ي' 'ك' 'ل' 'م' 'ن' 'س' 'ع' 'ف' 'ص' 'ق' 'ر' 'ش' 'ت' 'ث' 'خ' 'ذ' 'ض' 'ظ' 'غ'; */ } </bdo></code></p> <div id="out_arabic-abjad" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="ar" style="list-style-type: arabic-abjad; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ar" style="list-style-type: arabic-abjad; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ar" style="list-style-type: arabic-abjad;"><li>11</li></ol> <ol start="22" class="high" lang="ar" style="list-style-type: arabic-abjad;"><li>22</li></ol> <ol start="33" class="high" lang="ar" style="list-style-type: arabic-abjad;"><li>33</li></ol> <ol start="44" class="high" lang="ar" style="list-style-type: arabic-abjad;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ar" style="list-style-type: arabic-abjad;"><li>111</li></ol> <ol start="222" class="high" lang="ar" style="list-style-type: arabic-abjad;"><li>222</li></ol> <ol start="333" class="high" lang="ar" style="list-style-type: arabic-abjad;"><li>333</li></ol> <ol start="444" class="high" lang="ar" style="list-style-type: arabic-abjad;"><li>444</li></ol></div> </div></div> <script>addExamples('arabic-abjad', 'ar', 'rtl')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('kashmiri')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="kashmiri"><a href="#kashmiri">kashmiri</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style kashmiri { system: alphabetic; symbols: '\0627' '\0622' '\0628' '\067E' '\062A' '\0679' '\062B' '\062C' '\0686' '\062D' '\062E' '\062F' '\0688' '\0630' '\0631' '\0691' '\0632' '\0698' '\0633' '\0634' '\0635' '\0636' '\0637' '\0638' '\0639' '\063A' '\0641' '\0642' '\06A9' '\06AF' '\0644' '\0645' '\0646' '\06BA' '\0648' '\06C1' '\06BE' '\0621' '\06CC' '\06D2' '\06C4' '\0620'; suffix: ') '; /* symbols: 'ا' 'آ' 'ب' 'پ' 'ت' 'ٹ' 'ث' 'ج' 'چ' 'ح' 'خ' 'د' 'ڈ' 'ذ' 'ر' 'ڑ' 'ز' 'ژ' 'س' 'ش' 'ص' 'ض' 'ط' 'ظ' 'ع' 'غ' 'ف' 'ق' 'ک' 'گ' 'ل' 'م' 'ن' 'ں' 'و' 'ہ' 'ھ' 'ء' 'ی' 'ے' 'ۄ' 'ؠ'; */ } </bdo></code></p> <div id="out_kashmiri" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="ks" style="list-style-type: kashmiri; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ks" style="list-style-type: kashmiri; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ks" style="list-style-type: kashmiri;"><li>11</li></ol> <ol start="22" class="high" lang="ks" style="list-style-type: kashmiri;"><li>22</li></ol> <ol start="33" class="high" lang="ks" style="list-style-type: kashmiri;"><li>33</li></ol> <ol start="44" class="high" lang="ks" style="list-style-type: kashmiri;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ks" style="list-style-type: kashmiri;"><li>111</li></ol> <ol start="222" class="high" lang="ks" style="list-style-type: kashmiri;"><li>222</li></ol> <ol start="333" class="high" lang="ks" style="list-style-type: kashmiri;"><li>333</li></ol> <ol start="444" class="high" lang="ks" style="list-style-type: kashmiri;"><li>444</li></ol></div> </div></div> <script>addExamples('kashmiri', 'ks', 'rtl')</script> </div> <div class="note" role="note" id="issue-container-generatedID"><div role="heading" class="note-title marker" id="h-note" aria-level="3"><span>Note</span></div><aside class=""> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style kashmiri-dbl-paren { system: extends kashmiri; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('maghrebi-abjad')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="maghrebi-abjad"><a href="#maghrebi-abjad">maghrebi-abjad</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style maghrebi-abjad { system: fixed; symbols: '\627' '\628' '\62C' '\62F' '\647\200D' '\648' '\632' '\62D' '\637' '\64A' '\643' '\644' '\645' '\646' '\636' '\639' '\641' '\635' '\642' '\631' '\633' '\62A' '\62B' '\62E' '\630' '\638' '\63A' '\634'; /* symbols: 'ا' 'ب' 'ج' 'د' 'ه‍' 'و' 'ز' 'ح' 'ط' 'ي' 'ك' 'ل' 'م' 'ن' 'ص' 'ع' 'ف' 'ض' 'ق' 'ر' 'س' 'ت' 'ث' 'خ' 'ذ' 'ظ' 'غ' 'ش'; */ } </bdo></code></p> <div id="out_maghrebi-abjad" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="ar" style="list-style-type: maghrebi-abjad; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ar" style="list-style-type: maghrebi-abjad; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ar" style="list-style-type: maghrebi-abjad;"><li>11</li></ol> <ol start="22" class="high" lang="ar" style="list-style-type: maghrebi-abjad;"><li>22</li></ol> <ol start="33" class="high" lang="ar" style="list-style-type: maghrebi-abjad;"><li>33</li></ol> <ol start="44" class="high" lang="ar" style="list-style-type: maghrebi-abjad;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ar" style="list-style-type: maghrebi-abjad;"><li>111</li></ol> <ol start="222" class="high" lang="ar" style="list-style-type: maghrebi-abjad;"><li>222</li></ol> <ol start="333" class="high" lang="ar" style="list-style-type: maghrebi-abjad;"><li>333</li></ol> <ol start="444" class="high" lang="ar" style="list-style-type: maghrebi-abjad;"><li>444</li></ol></div> </div></div> <script>addExamples('maghrebi-abjad', 'ar', 'rtl')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('persian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="persian"><a href="#persian">persian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style persian { system: numeric; symbols: '\6F0' '\6F1' '\6F2' '\6F3' '\6F4' '\6F5' '\6F6' '\6F7' '\6F8' '\6F9'; /* symbols: '۰' '۱' '۲' '۳' '۴' '۵' '۶' '۷' '۸' '۹';*/ } </bdo></code></p> <div id="out_persian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="fa" style="list-style-type: persian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="fa" style="list-style-type: persian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="fa" style="list-style-type: persian;"><li>11</li></ol> <ol start="22" class="high" lang="fa" style="list-style-type: persian;"><li>22</li></ol> <ol start="33" class="high" lang="fa" style="list-style-type: persian;"><li>33</li></ol> <ol start="44" class="high" lang="fa" style="list-style-type: persian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="fa" style="list-style-type: persian;"><li>111</li></ol> <ol start="222" class="high" lang="fa" style="list-style-type: persian;"><li>222</li></ol> <ol start="333" class="high" lang="fa" style="list-style-type: persian;"><li>333</li></ol> <ol start="444" class="high" lang="fa" style="list-style-type: persian;"><li>444</li></ol></div> </div></div> <script>addExamples('persian', 'fa', 'rtl')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('persian-abjad')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="persian-abjad"><a href="#persian-abjad">persian-abjad</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style persian-abjad { system: fixed; symbols: '\627' '\628' '\62C' '\62F' '\647\200D' '\648' '\632' '\62D' '\637' '\6CC' '\6A9' '\644' '\645' '\646' '\633' '\639' '\641' '\635' '\642' '\631' '\634' '\62A' '\62B' '\62E' '\630' '\636' '\638' '\63A'; /* symbols: 'ا' 'ب' 'ج' 'د' 'ه‍' 'و' 'ز' 'ح' 'ط' 'ی' 'ک' 'ل' 'م' 'ن' 'س' 'ع' 'ف' 'ص' 'ق' 'ر' 'ش' 'ت' 'ث' 'خ' 'ذ' 'ض' 'ظ' 'غ'; */ } </bdo></code></p> <div id="out_persian-abjad" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="fa" style="list-style-type: persian-abjad; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="fa" style="list-style-type: persian-abjad; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="fa" style="list-style-type: persian-abjad;"><li>11</li></ol> <ol start="22" class="high" lang="fa" style="list-style-type: persian-abjad;"><li>22</li></ol> <ol start="33" class="high" lang="fa" style="list-style-type: persian-abjad;"><li>33</li></ol> <ol start="44" class="high" lang="fa" style="list-style-type: persian-abjad;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="fa" style="list-style-type: persian-abjad;"><li>111</li></ol> <ol start="222" class="high" lang="fa" style="list-style-type: persian-abjad;"><li>222</li></ol> <ol start="333" class="high" lang="fa" style="list-style-type: persian-abjad;"><li>333</li></ol> <ol start="444" class="high" lang="fa" style="list-style-type: persian-abjad;"><li>444</li></ol></div> </div></div> <script>addExamples('persian-abjad', 'fa', 'rtl')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('persian-alphabetic')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="persian-alphabetic"><a href="#persian-alphabetic">persian-alphabetic</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style persian-alphabetic { system: fixed; symbols: '\627' '\628' '\67E' '\62A' '\62B' '\62C' '\686' '\62D' '\62E' '\62F' '\630' '\631' '\632' '\698' '\633' '\634' '\635' '\636' '\637' '\638' '\639' '\63A' '\641' '\642' '\6A9' '\6AF' '\644' '\645' '\646' '\648' '\647\200D' '\6CC'; /* symbols: 'ا' 'ب' 'پ' 'ت' 'ث' 'ج' 'چ' 'ح' 'خ' 'د' 'ذ' 'ر' 'ز' 'ژ' 'س' 'ش' 'ص' 'ض' 'ط' 'ظ' 'ع' 'غ' 'ف' 'ق' 'ک' 'گ' 'ل' 'م' 'ن' 'و' 'ه‍' 'ی'; */ } </bdo></code></p> <div id="out_persian-alphabetic" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="fa" style="list-style-type: persian-alphabetic; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="fa" style="list-style-type: persian-alphabetic; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="fa" style="list-style-type: persian-alphabetic;"><li>11</li></ol> <ol start="22" class="high" lang="fa" style="list-style-type: persian-alphabetic;"><li>22</li></ol> <ol start="33" class="high" lang="fa" style="list-style-type: persian-alphabetic;"><li>33</li></ol> <ol start="44" class="high" lang="fa" style="list-style-type: persian-alphabetic;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="fa" style="list-style-type: persian-alphabetic;"><li>111</li></ol> <ol start="222" class="high" lang="fa" style="list-style-type: persian-alphabetic;"><li>222</li></ol> <ol start="333" class="high" lang="fa" style="list-style-type: persian-alphabetic;"><li>333</li></ol> <ol start="444" class="high" lang="fa" style="list-style-type: persian-alphabetic;"><li>444</li></ol></div> </div></div> <script>addExamples('persian-alphabetic', 'fa', 'rtl')</script> </div> <div class="note" role="note" id="issue-container-generatedID-0"><div role="heading" class="note-title marker" id="h-note-0" aria-level="3"><span>Note</span></div><p class="">The <code class="kw" translate="no">arabic-indic</code>, and <code class="kw" translate="no">persian</code> styles are defined in the <a href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a> specification. Check browser support for <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">arabic-indic</a></code> and <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">persian</a></code> styles.</p></div> <div class="note" role="note" id="issue-container-generatedID-1"><div role="heading" class="note-title marker" id="h-note-1" aria-level="3"><span>Note</span></div><p class="">Note that HEH+ZWJ are used together in lists of this kind to distinguish the heh from the number 5. The symbols are listed in logical order where escapes are used and also in the underlying code when they are represented as characters (so the code should copy-paste correctly). When reading the displayed list of symbols as arabic characters, however, you should read them RTL. (In previous versions of the document a <code class="kw" translate="no">bdo</code> element was used to display everything LTR, but this interfered with the display of the HEH, which is followed by a ZWJ and should appear to join to the left.)</p></div> <div class="note" role="note" id="issue-container-generatedID-2"><div role="heading" class="note-title marker" id="h-note-2" aria-level="3"><span>Note</span></div><div class=""> <table id="arabic_comp"> <tbody> <tr> <th scope="row"><code class="kw" translate="no">persian-abjad</code></th> <td>ا</td> <td>ب</td> <td>ج</td> <td>د</td> <td>ه‍</td> <td>و</td> <td>ز</td> <td>ح</td> <td>ط</td> <td>ی</td> <td>ک</td> <td>ل</td> <td>م</td> <td>ن</td> <td>س</td> <td>ع</td> <td>ف</td> <td>ص</td> <td>ق</td> <td>ر</td> <td>ش</td> <td>ت</td> <td>ث</td> <td>خ</td> <td>ذ</td> <td>ض</td> <td>ظ</td> <td>غ</td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <th scope="row"><code class="kw" translate="no">arabic-abjad</code></th> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td>ي</td> <td>ك</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <th scope="row"><code class="kw" translate="no">magrebi-abjad</code></th> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td>ص</td> <td> </td> <td> </td> <td>ض</td> <td> </td> <td> </td> <td>س</td> <td> </td> <td> </td> <td> </td> <td> </td> <td>ظ</td> <td>غ</td> <td>ش</td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <th scope="row">WP old magrebi</th> <td> </td> <td> </td> <td>ت</td> <td>ث</td> <td>ج</td> <td>ح</td> <td>خ</td> <td>د</td> <td>ذ</td> <td>ر</td> <td>ز</td> <td>ط</td> <td>ظ</td> <td>ك</td> <td>ل</td> <td>م</td> <td>ن</td> <td>ص</td> <td>ض</td> <td>ع</td> <td>غ</td> <td>ف</td> <td>ق</td> <td>س</td> <td>ش</td> <td>ه</td> <td>و</td> <td>ي</td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <th scope="row">WP hijai</th> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td>س</td> <td>ش</td> <td>ص</td> <td>ض</td> <td>ط</td> <td>ظ</td> <td>ع</td> <td>غ</td> <td>ف</td> <td>ق</td> <td>ك</td> <td>ل</td> <td>م</td> <td>ن</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <th scope="row"><code class="kw" translate="no">persian-alphabetic</code></th> <td> </td> <td> </td> <td>پ</td> <td>ت</td> <td>ث</td> <td>ج</td> <td>چ</td> <td>ح</td> <td>خ</td> <td>د</td> <td>ذ</td> <td>ر</td> <td>ز</td> <td>ژ</td> <td>س</td> <td>ش</td> <td>ص</td> <td>ض</td> <td>ط</td> <td>ظ</td> <td>ع</td> <td>غ</td> <td>ف</td> <td>ق</td> <td>ک</td> <td>گ</td> <td>ل</td> <td>م</td> <td>ن</td> <td>و</td> <td>ه‍</td> <td>ی</td> </tr> </tbody> </table> <p>This table shows the differences between the counter styles listed above for the arabic script. A blank cell uses the same letter as the nearest non-blank cell above it.</p> <p>Also included for comparison are two letter sequences that are not included here as counter styles, but that are mentioned in <a href="https://en.wikipedia.org/wiki/Abjad_numerals">Wikipedia</a> – an old maghrebi sequence and the hijai sequence.</p> </div></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('urdu')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="urdu"><a href="#urdu">urdu</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style urdu { system: numeric; symbols: '\6F0' '\6F1' '\6F2' '\6F3' '\6F4' '\6F5' '\6F6' '\6F7' '\6F8' '\6F9'; /* symbols: '۰' '۱' '۲' '۳' '۴' '۵' '۶' '۷' '۸' '۹';*/ suffix: '۔ '; } </bdo></code></p> <div id="out_urdu" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="ur" style="list-style-type: urdu; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ur" style="list-style-type: urdu; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ur" style="list-style-type: urdu;"><li>11</li></ol> <ol start="22" class="high" lang="ur" style="list-style-type: urdu;"><li>22</li></ol> <ol start="33" class="high" lang="ur" style="list-style-type: urdu;"><li>33</li></ol> <ol start="44" class="high" lang="ur" style="list-style-type: urdu;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ur" style="list-style-type: urdu;"><li>111</li></ol> <ol start="222" class="high" lang="ur" style="list-style-type: urdu;"><li>222</li></ol> <ol start="333" class="high" lang="ur" style="list-style-type: urdu;"><li>333</li></ol> <ol start="444" class="high" lang="ur" style="list-style-type: urdu;"><li>444</li></ol></div> </div></div> <script>addExamples('urdu', 'ur', 'rtl')</script> </div> <div class="note" role="note" id="issue-container-generatedID-3"><div role="heading" class="note-title marker" id="h-note-3" aria-level="3"><span>Note</span></div><p class="">Blink and Webkit have built-in support for an <code class="kw" translate="no">urdu</code><code class="kw" translate="no"></code> style, which is identical to the Persian style above. Here we repeat that style, but add a default Arabic full stop as the suffix (not built-in to Blink or Webkit). There is no built-in support in Gecko browsers. This<code class="kw" translate="no"></code> template can be used to provide support in Firefox via a declaration in the CSS file.</p></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('urdu-abjad')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="urdu-abjad"><a href="#urdu-abjad">urdu-abjad</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style urdu-abjad { system: fixed; symbols: '\0627' '\0628' '\062C' '\062F' '\06C1' '\0648' '\0632' '\062D' '\0637' '\06CC' '\06A9' '\0644' '\0645' '\0646' '\0633' '\0639' '\0641' '\0635' '\0642' '\0631' '\0634' '\062A' '\062B' '\062E' '\0630' '\0636' '\0638' '\063A '; /* symbols: 'ا' 'ب' 'ج' 'د' 'ہ' 'و' 'ز' 'ح' 'ط' 'ی' 'ک' 'ل' 'م' 'ن' 'س' 'ع' 'ف' 'ص' 'ق' 'ر' 'ش' 'ت' 'ث' 'خ' 'ذ' 'ض' 'ظ' 'غ'; */ } </bdo></code></p> <div id="out_urdu-abjad" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="ur" style="list-style-type: urdu-abjad; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ur" style="list-style-type: urdu-abjad; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ur" style="list-style-type: urdu-abjad;"><li>11</li></ol> <ol start="22" class="high" lang="ur" style="list-style-type: urdu-abjad;"><li>22</li></ol> <ol start="33" class="high" lang="ur" style="list-style-type: urdu-abjad;"><li>33</li></ol> <ol start="44" class="high" lang="ur" style="list-style-type: urdu-abjad;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ur" style="list-style-type: urdu-abjad;"><li>111</li></ol> <ol start="222" class="high" lang="ur" style="list-style-type: urdu-abjad;"><li>222</li></ol> <ol start="333" class="high" lang="ur" style="list-style-type: urdu-abjad;"><li>333</li></ol> <ol start="444" class="high" lang="ur" style="list-style-type: urdu-abjad;"><li>444</li></ol></div> </div></div> <script>addExamples('urdu-abjad', 'ur', 'rtl')</script> </div> </section> <div class="note" role="note" id="issue-container-generatedID-4"><div role="heading" class="note-title marker" id="h-note-4" aria-level="2"><span>Note</span></div><p class="">We have reports of an alternative abjad style for Urdu that replaces <span lang="ur" dir="rtl">ک</span>, <span lang="ur" dir="rtl">ل</span>, and <span lang="ur" dir="rtl">م</span> for 11, 12, 13 with <span lang="ur" dir="rtl">یا</span>, <span lang="ur" dir="rtl">یب</span>, and <span lang="ur" dir="rtl">یج</span>, respectively. These two styles may be used in the same publication, such as one in the front matter, the other in the preface.</p></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('urdu-alphabetic')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="urdu-alphabetic"><a href="#urdu-alphabetic">urdu-alphabetic</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style urdu-alphabetic { system: fixed; symbols: '\0627' '\0628' '\067E' '\062A' '\0679' '\062B' '\062C' '\0686' '\062D' '\062E' '\062F' '\0688' '\0630' '\0631' '\0691' '\0632' '\0698' '\0633' '\0634' '\0635' '\0636' '\0637' '\0638' '\0639' '\063A' '\0641' '\0642' '\06A9' '\06AF' '\0644' '\0645' '\0646' '\06BA' '\0648' '\06C1' '\06BE' '\0621' '\06CC'; /* symbols: 'ا' 'ب' 'پ' 'ت' 'ٹ' 'ث' 'ج' 'چ' 'ح' 'خ' 'د' 'ڈ' 'ذ' 'ر' 'ڑ' 'ز' 'ژ' 'س' 'ش' 'ص' 'ض' 'ط' 'ظ' 'ع' 'غ' 'ف' 'ق' 'ک' 'گ' 'ل' 'م' 'ن' 'ں' 'و' 'ہ' 'ھ' 'ء' 'ی'; */ } </bdo></code></p> <div id="out_urdu-alphabetic" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="ur" style="list-style-type: urdu-alphabetic; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ur" style="list-style-type: urdu-alphabetic; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ur" style="list-style-type: urdu-alphabetic;"><li>11</li></ol> <ol start="22" class="high" lang="ur" style="list-style-type: urdu-alphabetic;"><li>22</li></ol> <ol start="33" class="high" lang="ur" style="list-style-type: urdu-alphabetic;"><li>33</li></ol> <ol start="44" class="high" lang="ur" style="list-style-type: urdu-alphabetic;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ur" style="list-style-type: urdu-alphabetic;"><li>111</li></ol> <ol start="222" class="high" lang="ur" style="list-style-type: urdu-alphabetic;"><li>222</li></ol> <ol start="333" class="high" lang="ur" style="list-style-type: urdu-alphabetic;"><li>333</li></ol> <ol start="444" class="high" lang="ur" style="list-style-type: urdu-alphabetic;"><li>444</li></ol></div> </div></div> <script>addExamples('urdu-alphabetic', 'ur', 'rtl')</script> </div> <div class="note" role="note" id="issue-container-generatedID-5"><div role="heading" class="note-title marker" id="h-note-5" aria-level="2"><span>Note</span></div><aside class=""> <p>The urdu-alphabetic style is shown here as a fixed style. According to <abbr title="Centre for Development of Advanced Computing">CDAC</abbr>, it is actually an unlimited style, where characters are doubled after the initial set is exhausted, eg. <span dir="rtl" lang="ur">ا ا</span>, <span dir="rtl" lang="ur">ب ب</span>, <span dir="rtl" lang="ur">ت ت</span>, etc. This can't be achieved using the standard 'alphabetic' algorithm. Furthermore, counters in this range do not join cursively, but are separated by a space. Until we have clearer evidence about how this works we list the style as fixed in length.</p> </aside></div> <section id="armenian-styles"><div class="header-wrapper"><h2 id="x4-armenian"><bdi class="secno">4. </bdi>Armenian</h2><a class="self-link" href="#armenian-styles" aria-label="Permalink for Section 4."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('armenian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="armenian"><a href="#armenian">armenian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style armenian { system: additive; range: 1 9999; 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'; /* additive-symbols: 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 'Ա'; */ } </bdo></code></p> <div id="out_armenian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="hy" style="list-style-type: armenian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="hy" style="list-style-type: armenian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="hy" style="list-style-type: armenian;"><li>11</li></ol> <ol start="22" class="high" lang="hy" style="list-style-type: armenian;"><li>22</li></ol> <ol start="33" class="high" lang="hy" style="list-style-type: armenian;"><li>33</li></ol> <ol start="44" class="high" lang="hy" style="list-style-type: armenian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="hy" style="list-style-type: armenian;"><li>111</li></ol> <ol start="222" class="high" lang="hy" style="list-style-type: armenian;"><li>222</li></ol> <ol start="333" class="high" lang="hy" style="list-style-type: armenian;"><li>333</li></ol> <ol start="444" class="high" lang="hy" style="list-style-type: armenian;"><li>444</li></ol></div> </div></div> <script>addExamples('armenian', 'hy', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-armenian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-armenian"><a href="#lower-armenian">lower-armenian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-armenian { system: additive; range: 1 9999; additive-symbols: 9000 '\584', 8000 '\583', 7000 '\582', 6000 '\581', 5000 '\580', 4000 '\57F', 3000 '\57E', 2000 '\57D', 1000 '\57C', 900 '\57B', 800 '\57A', 700 '\579', 600 '\578', 500 '\577', 400 '\576', 300 '\575', 200 '\574', 100 '\573', 90 '\572', 80 '\571', 70 '\570', 60 '\56F', 50 '\56E', 40 '\56D', 30 '\56C', 20 '\56B', 10 '\56A', 9 '\569', 8 '\568', 7 '\567', 6 '\566', 5 '\565', 4 '\564', 3 '\563', 2 '\562', 1 '\561'; /* additive-symbols: 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 'ա'; */ } </bdo></code></p> <div id="out_lower-armenian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="hy" style="list-style-type: lower-armenian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="hy" style="list-style-type: lower-armenian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="hy" style="list-style-type: lower-armenian;"><li>11</li></ol> <ol start="22" class="high" lang="hy" style="list-style-type: lower-armenian;"><li>22</li></ol> <ol start="33" class="high" lang="hy" style="list-style-type: lower-armenian;"><li>33</li></ol> <ol start="44" class="high" lang="hy" style="list-style-type: lower-armenian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="hy" style="list-style-type: lower-armenian;"><li>111</li></ol> <ol start="222" class="high" lang="hy" style="list-style-type: lower-armenian;"><li>222</li></ol> <ol start="333" class="high" lang="hy" style="list-style-type: lower-armenian;"><li>333</li></ol> <ol start="444" class="high" lang="hy" style="list-style-type: lower-armenian;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-armenian', 'hy', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-armenian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-armenian"><a href="#upper-armenian">upper-armenian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-armenian { system: additive; range: 1 9999; 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'; /* additive-symbols: 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 'Ա'; */ } </bdo></code></p> <div id="out_upper-armenian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="hy" style="list-style-type: upper-armenian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="hy" style="list-style-type: upper-armenian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="hy" style="list-style-type: upper-armenian;"><li>11</li></ol> <ol start="22" class="high" lang="hy" style="list-style-type: upper-armenian;"><li>22</li></ol> <ol start="33" class="high" lang="hy" style="list-style-type: upper-armenian;"><li>33</li></ol> <ol start="44" class="high" lang="hy" style="list-style-type: upper-armenian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="hy" style="list-style-type: upper-armenian;"><li>111</li></ol> <ol start="222" class="high" lang="hy" style="list-style-type: upper-armenian;"><li>222</li></ol> <ol start="333" class="high" lang="hy" style="list-style-type: upper-armenian;"><li>333</li></ol> <ol start="444" class="high" lang="hy" style="list-style-type: upper-armenian;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-armenian', 'hy', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-6"><div role="heading" class="note-title marker" id="h-note-6" aria-level="3"><span>Note</span></div><p class="">All styles are defined in the <a href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a> specification. Check browser support for <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">armenian</a></code>, <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">lower-armenian</a></code> and <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">upper-armenian</a></code> styles.</p></div> </section> <section id="balinese-styles"><div class="header-wrapper"><h2 id="x5-balinese"><bdi class="secno">5. </bdi>Balinese</h2><a class="self-link" href="#balinese-styles" aria-label="Permalink for Section 5."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('balinese')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="balinese"><a href="#balinese">balinese</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style balinese { system: numeric; symbols: '\1B50' '\1B51' '\1B52' '\1B53' '\1B54' '\1B55' '\1B56' '\1B57' '\1B58' '\1B59' ; /* symbols: '᭐' '᭑' '᭒' '᭓' '᭔' '᭕' '᭖' '᭗' '᭘' '᭙'; */ } </bdo></code></p> <div id="out_balinese" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ban" style="list-style-type: balinese; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ban" style="list-style-type: balinese; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ban" style="list-style-type: balinese;"><li>11</li></ol> <ol start="22" class="high" lang="ban" style="list-style-type: balinese;"><li>22</li></ol> <ol start="33" class="high" lang="ban" style="list-style-type: balinese;"><li>33</li></ol> <ol start="44" class="high" lang="ban" style="list-style-type: balinese;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ban" style="list-style-type: balinese;"><li>111</li></ol> <ol start="222" class="high" lang="ban" style="list-style-type: balinese;"><li>222</li></ol> <ol start="333" class="high" lang="ban" style="list-style-type: balinese;"><li>333</li></ol> <ol start="444" class="high" lang="ban" style="list-style-type: balinese;"><li>444</li></ol></div> </div></div> <script>addExamples('balinese', 'ban', '')</script> </div> </section> <section id="bamum-styles"><div class="header-wrapper"><h2 id="x6-bamum"><bdi class="secno">6. </bdi>Bamum</h2><a class="self-link" href="#bamum-styles" aria-label="Permalink for Section 6."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('bamum')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="bamum"><a href="#bamum">bamum</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style bamum { system: numeric; symbols: '\A6EF' '\A6E6' '\A6E7' '\A6E8' '\A6E9' '\A6EA' '\A6EB' '\A6EC' '\A6ED' '\A6EE' ; /* symbols: 'ꛯ' 'ꛦ' 'ꛧ' 'ꛨ' 'ꛩ' 'ꛪ' 'ꛫ' 'ꛬ' 'ꛭ' 'ꛮ'; */ } </bdo></code></p> <div id="out_bamum" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="bsq" style="list-style-type: bamum; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="bsq" style="list-style-type: bamum; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="bsq" style="list-style-type: bamum;"><li>11</li></ol> <ol start="22" class="high" lang="bsq" style="list-style-type: bamum;"><li>22</li></ol> <ol start="33" class="high" lang="bsq" style="list-style-type: bamum;"><li>33</li></ol> <ol start="44" class="high" lang="bsq" style="list-style-type: bamum;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="bsq" style="list-style-type: bamum;"><li>111</li></ol> <ol start="222" class="high" lang="bsq" style="list-style-type: bamum;"><li>222</li></ol> <ol start="333" class="high" lang="bsq" style="list-style-type: bamum;"><li>333</li></ol> <ol start="444" class="high" lang="bsq" style="list-style-type: bamum;"><li>444</li></ol></div> </div></div> <script>addExamples('bamum', 'bsq', '')</script> </div> </section> <section id="bengali-styles"><div class="header-wrapper"><h2 id="x7-bengali"><bdi class="secno">7. </bdi>Bengali</h2><a class="self-link" href="#bengali-styles" aria-label="Permalink for Section 7."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('bengali')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="bengali"><a href="#bengali">bengali</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style bengali { system: numeric; symbols: '\9E6' '\9E7' '\9E8' '\9E9' '\9EA' '\9EB' '\9EC' '\9ED' '\9EE' '\9EF'; /* symbols: '০' '১' '২' '৩' '৪' '৫' '৬' '৭' '৮' '৯'; */ } </bdo></code></p> <div id="out_bengali" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="bn" style="list-style-type: bengali; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="bn" style="list-style-type: bengali; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="bn" style="list-style-type: bengali;"><li>11</li></ol> <ol start="22" class="high" lang="bn" style="list-style-type: bengali;"><li>22</li></ol> <ol start="33" class="high" lang="bn" style="list-style-type: bengali;"><li>33</li></ol> <ol start="44" class="high" lang="bn" style="list-style-type: bengali;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="bn" style="list-style-type: bengali;"><li>111</li></ol> <ol start="222" class="high" lang="bn" style="list-style-type: bengali;"><li>222</li></ol> <ol start="333" class="high" lang="bn" style="list-style-type: bengali;"><li>333</li></ol> <ol start="444" class="high" lang="bn" style="list-style-type: bengali;"><li>444</li></ol></div> </div></div> <script>addExamples('bengali', 'bn', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-7"><div role="heading" class="note-title marker" id="h-note-7" aria-level="3"><span>Note</span></div><p class="">This style is defined in the <a href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">bengali</a></code> style.</p></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('bangla')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="bangla"><a href="#bangla">bangla</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style bangla { system: alphabetic; symbols: '\0995' '\0996' '\0997' '\0998' '\0999' '\099A' '\099B' '\099C' '\099D' '\099E' '\099F' '\09A0' '\09A1' '\09A1\09BC' '\09A2' '\09A2\09BC' '\09A3' '\09A4' '\09CE' '\09A5' '\09A6' '\09A7' '\09A8' '\09AA' '\09AB' '\09AC' '\09AD' '\09AE' '\09AF' '\09AF\09BC' '\09B0' '\09B2' '\09B6' '\09B7' '\09B8' '\09B9' ; /* symbols: 'ক' 'খ' 'গ' 'ঘ' 'ঙ' 'চ' 'ছ' 'জ' 'ঝ' 'ঞ' 'ট' 'ঠ' 'ড' 'ড়' 'ঢ' 'ঢ়' 'ণ' 'ত' 'ৎ' 'থ' 'দ' 'ধ' 'ন' 'প' 'ফ' 'ব' 'ভ' 'ম' 'য' 'য়' 'র' 'ল' 'শ' 'ষ' 'স' 'হ' ; */ suffix: ') '; } </bdo></code></p> <div id="out_bangla" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="bn" style="list-style-type: bangla; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="bn" style="list-style-type: bangla; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="bn" style="list-style-type: bangla;"><li>11</li></ol> <ol start="22" class="high" lang="bn" style="list-style-type: bangla;"><li>22</li></ol> <ol start="33" class="high" lang="bn" style="list-style-type: bangla;"><li>33</li></ol> <ol start="44" class="high" lang="bn" style="list-style-type: bangla;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="bn" style="list-style-type: bangla;"><li>111</li></ol> <ol start="222" class="high" lang="bn" style="list-style-type: bangla;"><li>222</li></ol> <ol start="333" class="high" lang="bn" style="list-style-type: bangla;"><li>333</li></ol> <ol start="444" class="high" lang="bn" style="list-style-type: bangla;"><li>444</li></ol></div> </div></div> <script>addExamples('bangla', 'bn', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-8"><div role="heading" class="note-title marker" id="h-note-8" aria-level="3"><span>Note</span></div><aside class=""> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style bangla-dbl-paren { system: extends bangla; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> </section> <section id="bopomofo-styles"><div class="header-wrapper"><h2 id="x8-bopomofo"><bdi class="secno">8. </bdi>Bopomofo</h2><a class="self-link" href="#bopomofo-styles" aria-label="Permalink for Section 8."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('zhuyin')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="zhuyin"><a href="#zhuyin">zhuyin</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style zhuyin { system: alphabetic; symbols: "\3105" "\3106" "\3107" "\3108" "\3109" "\310A" "\310B" "\310C" "\310D" "\310E" "\310F" "\3110" "\3111" "\3112" "\3113" "\3114" "\3115" "\3116" "\3117" "\3118" "\3119" "\311A" "\311B" "\311C" "\311D" "\311E" "\311F" "\3120" "\3121" "\3122" "\3123" "\3124" "\3125" "\3126" "\3127" "\3128" "\3129"; /* ㄅㄆㄇㄈㄉㄊㄋㄌㄍㄎㄏㄐㄑㄒㄓㄔㄕㄖㄗㄘㄙㄚㄛㄜㄝㄞㄟㄠㄡㄢㄣㄤㄥㄦㄧㄨㄩ */ suffix: "、"; } </bdo></code></p> <div id="out_zhuyin" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: zhuyin; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: zhuyin; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: zhuyin;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: zhuyin;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: zhuyin;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: zhuyin;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: zhuyin;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: zhuyin;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: zhuyin;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: zhuyin;"><li>444</li></ol></div> </div></div> <script>addExamples('zhuyin', 'zh', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-9"><div role="heading" class="note-title marker" id="h-note-9" aria-level="3"><span>Note</span></div><p class="">The term "zhuyin" is used instead of "bopomofo" as the ordering follows the <a href="https://language.moe.gov.tw/001/Upload/files/site_content/M0001/juyin/html_ch/index.html">modern Taiwanese Mandarin order</a> rather than one of the other possible bopomofo styles. Other bopomofo styles may be introduced at a later time.</p></div> </section> <section id="cyrillic-styles"><div class="header-wrapper"><h2 id="x9-cyrillic"><bdi class="secno">9. </bdi>Cyrillic</h2><a class="self-link" href="#cyrillic-styles" aria-label="Permalink for Section 9."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-belorussian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-belorussian"><a href="#lower-belorussian">lower-belorussian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-belorussian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\435' '\451' '\436' '\437' '\456' '\439' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\45E' '\444' '\445' '\446' '\447' '\448' '\44B' '\44C' '\44D' '\44E' '\44F'; /* symbols: 'а' 'б' 'в' 'г' 'д' 'е' 'ё' 'ж' 'з' 'і' 'й' 'к' 'л' 'м' 'н' 'о' 'п' 'р' 'с' 'т' 'у' 'ў' 'ф' 'х' 'ц' 'ч' 'ш' 'ы' 'ь' 'э' 'ю' 'я'; */ suffix: ') '; } </bdo></code></p> <div id="out_lower-belorussian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="be" style="list-style-type: lower-belorussian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="be" style="list-style-type: lower-belorussian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="be" style="list-style-type: lower-belorussian;"><li>11</li></ol> <ol start="22" class="high" lang="be" style="list-style-type: lower-belorussian;"><li>22</li></ol> <ol start="33" class="high" lang="be" style="list-style-type: lower-belorussian;"><li>33</li></ol> <ol start="44" class="high" lang="be" style="list-style-type: lower-belorussian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="be" style="list-style-type: lower-belorussian;"><li>111</li></ol> <ol start="222" class="high" lang="be" style="list-style-type: lower-belorussian;"><li>222</li></ol> <ol start="333" class="high" lang="be" style="list-style-type: lower-belorussian;"><li>333</li></ol> <ol start="444" class="high" lang="be" style="list-style-type: lower-belorussian;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-belorussian', 'be', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-belorussian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-belorussian"><a href="#upper-belorussian">upper-belorussian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-belorussian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\415' '\401' '\416' '\417' '\406' '\419' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\40E' '\424' '\425' '\426' '\427' '\428' '\42B' '\42C' '\42D' '\42E' '\42F'; /* symbols: 'А' 'Б' 'В' 'Г' 'Д' 'Е' 'Ё' 'Ж' 'З' 'І' 'Й' 'К' 'Л' 'М' 'Н' 'О' 'П' 'Р' 'С' 'Т' 'У' 'Ў' 'Ф' 'Х' 'Ц' 'Ч' 'Ш' 'Ы' 'Ь' 'Э' 'Ю' 'Я'; */ } </bdo></code></p> <div id="out_upper-belorussian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="be" style="list-style-type: upper-belorussian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="be" style="list-style-type: upper-belorussian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="be" style="list-style-type: upper-belorussian;"><li>11</li></ol> <ol start="22" class="high" lang="be" style="list-style-type: upper-belorussian;"><li>22</li></ol> <ol start="33" class="high" lang="be" style="list-style-type: upper-belorussian;"><li>33</li></ol> <ol start="44" class="high" lang="be" style="list-style-type: upper-belorussian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="be" style="list-style-type: upper-belorussian;"><li>111</li></ol> <ol start="222" class="high" lang="be" style="list-style-type: upper-belorussian;"><li>222</li></ol> <ol start="333" class="high" lang="be" style="list-style-type: upper-belorussian;"><li>333</li></ol> <ol start="444" class="high" lang="be" style="list-style-type: upper-belorussian;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-belorussian', 'be', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-bulgarian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-bulgarian"><a href="#lower-bulgarian">lower-bulgarian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-bulgarian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\435' '\436' '\437' '\438' '\439' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\444' '\445' '\446' '\447' '\448' '\449' '\44A' '\44C' '\44E' '\44F'; /* symbols: 'а' 'б' 'в' 'г' 'д' 'е' 'ж' 'з' 'и' 'й' 'к' 'л' 'м' 'н' 'о' 'п' 'р' 'с' 'т' 'у' 'ф' 'х' 'ц' 'ч' 'ш' 'щ' 'ъ' 'ь' 'ю' 'я'; */ suffix: ') '; } </bdo></code></p> <div id="out_lower-bulgarian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="bg" style="list-style-type: lower-bulgarian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="bg" style="list-style-type: lower-bulgarian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="bg" style="list-style-type: lower-bulgarian;"><li>11</li></ol> <ol start="22" class="high" lang="bg" style="list-style-type: lower-bulgarian;"><li>22</li></ol> <ol start="33" class="high" lang="bg" style="list-style-type: lower-bulgarian;"><li>33</li></ol> <ol start="44" class="high" lang="bg" style="list-style-type: lower-bulgarian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="bg" style="list-style-type: lower-bulgarian;"><li>111</li></ol> <ol start="222" class="high" lang="bg" style="list-style-type: lower-bulgarian;"><li>222</li></ol> <ol start="333" class="high" lang="bg" style="list-style-type: lower-bulgarian;"><li>333</li></ol> <ol start="444" class="high" lang="bg" style="list-style-type: lower-bulgarian;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-bulgarian', 'bg', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-bulgarian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-bulgarian"><a href="#upper-bulgarian">upper-bulgarian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-bulgarian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\415' '\416' '\417' '\418' '\419' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\424' '\425' '\426' '\427' '\428' '\429' '\42A' '\42C' '\42E' '\42F'; /* symbols: 'А' 'Б' 'В' 'Г' 'Д' 'Е' 'Ж' 'З' 'И' 'Й' 'К' 'Л' 'М' 'Н' 'О' 'П' 'Р' 'С' 'Т' 'У' 'Ф' 'Х' 'Ц' 'Ч' 'Ш' 'Щ' 'Ъ' 'Ь' 'Ю' 'Я'; */ } </bdo></code></p> <div id="out_upper-bulgarian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="bg" style="list-style-type: upper-bulgarian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="bg" style="list-style-type: upper-bulgarian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="bg" style="list-style-type: upper-bulgarian;"><li>11</li></ol> <ol start="22" class="high" lang="bg" style="list-style-type: upper-bulgarian;"><li>22</li></ol> <ol start="33" class="high" lang="bg" style="list-style-type: upper-bulgarian;"><li>33</li></ol> <ol start="44" class="high" lang="bg" style="list-style-type: upper-bulgarian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="bg" style="list-style-type: upper-bulgarian;"><li>111</li></ol> <ol start="222" class="high" lang="bg" style="list-style-type: upper-bulgarian;"><li>222</li></ol> <ol start="333" class="high" lang="bg" style="list-style-type: upper-bulgarian;"><li>333</li></ol> <ol start="444" class="high" lang="bg" style="list-style-type: upper-bulgarian;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-bulgarian', 'bg', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-macedonian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-macedonian"><a href="#lower-macedonian">lower-macedonian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-macedonian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\453' '\435' '\436' '\437' '\455' '\438' '\458' '\43A' '\43B' '\459' '\43C' '\43D' '\45A' '\43E' '\43F' '\440' '\441' '\442' '\45C' '\443' '\444' '\445' '\446' '\447' '\45F' '\448'; /* symbols: 'а' 'б' 'в' 'г' 'д' 'ѓ' 'е' 'ж' 'з' 'ѕ' 'и' 'ј' 'к' 'л' 'љ' 'м' 'н' 'њ' 'о' 'п' 'р' 'с' 'т' 'ќ' 'у' 'ф' 'х' 'ц' 'ч' 'џ' 'ш'; */ suffix: ') '; } </bdo></code></p> <div id="out_lower-macedonian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="mk" style="list-style-type: lower-macedonian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="mk" style="list-style-type: lower-macedonian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="mk" style="list-style-type: lower-macedonian;"><li>11</li></ol> <ol start="22" class="high" lang="mk" style="list-style-type: lower-macedonian;"><li>22</li></ol> <ol start="33" class="high" lang="mk" style="list-style-type: lower-macedonian;"><li>33</li></ol> <ol start="44" class="high" lang="mk" style="list-style-type: lower-macedonian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="mk" style="list-style-type: lower-macedonian;"><li>111</li></ol> <ol start="222" class="high" lang="mk" style="list-style-type: lower-macedonian;"><li>222</li></ol> <ol start="333" class="high" lang="mk" style="list-style-type: lower-macedonian;"><li>333</li></ol> <ol start="444" class="high" lang="mk" style="list-style-type: lower-macedonian;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-macedonian', 'mk', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-macedonian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-macedonian"><a href="#upper-macedonian">upper-macedonian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-macedonian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\403' '\415' '\416' '\417' '\405' '\418' '\408' '\41A' '\41B' '\409' '\41C' '\41D' '\40A' '\41E' '\41F' '\420' '\421' '\422' '\40C' '\423' '\424' '\425' '\426' '\427' '\40F' '\428'; /* symbols: 'А' 'Б' 'В' 'Г' 'Д' 'Ѓ' 'Е' 'Ж' 'З' 'Ѕ' 'И' 'Ј' 'К' 'Л' 'Љ' 'М' 'Н' 'Њ' 'О' 'П' 'Р' 'С' 'Т' 'Ќ' 'У' 'Ф' 'Х' 'Ц' 'Ч' 'Џ' 'Ш'; */ } </bdo></code></p> <div id="out_upper-macedonian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="mk" style="list-style-type: upper-macedonian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="mk" style="list-style-type: upper-macedonian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="mk" style="list-style-type: upper-macedonian;"><li>11</li></ol> <ol start="22" class="high" lang="mk" style="list-style-type: upper-macedonian;"><li>22</li></ol> <ol start="33" class="high" lang="mk" style="list-style-type: upper-macedonian;"><li>33</li></ol> <ol start="44" class="high" lang="mk" style="list-style-type: upper-macedonian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="mk" style="list-style-type: upper-macedonian;"><li>111</li></ol> <ol start="222" class="high" lang="mk" style="list-style-type: upper-macedonian;"><li>222</li></ol> <ol start="333" class="high" lang="mk" style="list-style-type: upper-macedonian;"><li>333</li></ol> <ol start="444" class="high" lang="mk" style="list-style-type: upper-macedonian;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-macedonian', 'mk', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-russian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-russian"><a href="#lower-russian">lower-russian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-russian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\435' '\436' '\437' '\438' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\444' '\445' '\446' '\447' '\448' '\449' '\44D' '\44E' '\44F'; /* symbols: 'а' 'б' 'в' 'г' 'д' 'е' 'ж' 'з' 'и' 'к' 'л' 'м' 'н' 'о' 'п' 'р' 'с' 'т' 'у' 'ф' 'х' 'ц' 'ч' 'ш' 'щ' 'э' 'ю' 'я'; */ suffix: ') '; } </bdo></code></p> <div id="out_lower-russian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ru" style="list-style-type: lower-russian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ru" style="list-style-type: lower-russian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ru" style="list-style-type: lower-russian;"><li>11</li></ol> <ol start="22" class="high" lang="ru" style="list-style-type: lower-russian;"><li>22</li></ol> <ol start="33" class="high" lang="ru" style="list-style-type: lower-russian;"><li>33</li></ol> <ol start="44" class="high" lang="ru" style="list-style-type: lower-russian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ru" style="list-style-type: lower-russian;"><li>111</li></ol> <ol start="222" class="high" lang="ru" style="list-style-type: lower-russian;"><li>222</li></ol> <ol start="333" class="high" lang="ru" style="list-style-type: lower-russian;"><li>333</li></ol> <ol start="444" class="high" lang="ru" style="list-style-type: lower-russian;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-russian', 'ru', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-russian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-russian"><a href="#upper-russian">upper-russian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-russian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\415' '\416' '\417' '\418' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\424' '\425' '\426' '\427' '\428' '\429' '\42D' '\42E' '\42F'; /* symbols: 'А' 'Б' 'В' 'Г' 'Д' 'Е' 'Ж' 'З' 'И' 'К' 'Л' 'М' 'Н' 'О' 'П' 'Р' 'С' 'Т' 'У' 'Ф' 'Х' 'Ц' 'Ч' 'Ш' 'Щ' 'Э' 'Ю' 'Я'; */ } </bdo></code></p> <div id="out_upper-russian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ru" style="list-style-type: upper-russian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ru" style="list-style-type: upper-russian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ru" style="list-style-type: upper-russian;"><li>11</li></ol> <ol start="22" class="high" lang="ru" style="list-style-type: upper-russian;"><li>22</li></ol> <ol start="33" class="high" lang="ru" style="list-style-type: upper-russian;"><li>33</li></ol> <ol start="44" class="high" lang="ru" style="list-style-type: upper-russian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ru" style="list-style-type: upper-russian;"><li>111</li></ol> <ol start="222" class="high" lang="ru" style="list-style-type: upper-russian;"><li>222</li></ol> <ol start="333" class="high" lang="ru" style="list-style-type: upper-russian;"><li>333</li></ol> <ol start="444" class="high" lang="ru" style="list-style-type: upper-russian;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-russian', 'ru', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-russian-full')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-russian-full"><a href="#lower-russian-full">lower-russian-full</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-russian-full { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\435' '\451' '\436' '\437' '\438' '\439' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\444' '\445' '\446' '\447' '\448' '\449' '\44A' '\44B' '\44C' '\44D' '\44E' '\44F'; /* symbols: 'а' 'б' 'в' 'г' 'д' 'е' 'ё' 'ж' 'з' 'и' 'й' 'к' 'л' 'м' 'н' 'о' 'п' 'р' 'с' 'т' 'у' 'ф' 'х' 'ц' 'ч' 'ш' 'щ' 'ъ' 'ы' 'ь' 'э' 'ю' 'я'; */ suffix: ') '; } </bdo></code></p> <div id="out_lower-russian-full" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ru" style="list-style-type: lower-russian-full; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ru" style="list-style-type: lower-russian-full; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ru" style="list-style-type: lower-russian-full;"><li>11</li></ol> <ol start="22" class="high" lang="ru" style="list-style-type: lower-russian-full;"><li>22</li></ol> <ol start="33" class="high" lang="ru" style="list-style-type: lower-russian-full;"><li>33</li></ol> <ol start="44" class="high" lang="ru" style="list-style-type: lower-russian-full;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ru" style="list-style-type: lower-russian-full;"><li>111</li></ol> <ol start="222" class="high" lang="ru" style="list-style-type: lower-russian-full;"><li>222</li></ol> <ol start="333" class="high" lang="ru" style="list-style-type: lower-russian-full;"><li>333</li></ol> <ol start="444" class="high" lang="ru" style="list-style-type: lower-russian-full;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-russian-full', 'ru', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-russian-full')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-russian-full"><a href="#upper-russian-full">upper-russian-full</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-russian-full { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\415' '\401' '\416' '\417' '\418' '\419' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\424' '\425' '\426' '\427' '\428' '\429' '\42A' '\42B' '\42C' '\42D' '\42E' '\42F'; /* symbols: 'А' 'Б' 'В' 'Г' 'Д' 'Е' 'Ё' 'Ж' 'З' 'И' 'Й' 'К' 'Л' 'М' 'Н' 'О' 'П' 'Р' 'С' 'Т' 'У' 'Ф' 'Х' 'Ц' 'Ч' 'Ш' 'Щ' 'Ъ' 'Ы' 'Ь' 'Э' 'Ю' 'Я'; */ } </bdo></code></p> <div id="out_upper-russian-full" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ru" style="list-style-type: upper-russian-full; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ru" style="list-style-type: upper-russian-full; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ru" style="list-style-type: upper-russian-full;"><li>11</li></ol> <ol start="22" class="high" lang="ru" style="list-style-type: upper-russian-full;"><li>22</li></ol> <ol start="33" class="high" lang="ru" style="list-style-type: upper-russian-full;"><li>33</li></ol> <ol start="44" class="high" lang="ru" style="list-style-type: upper-russian-full;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ru" style="list-style-type: upper-russian-full;"><li>111</li></ol> <ol start="222" class="high" lang="ru" style="list-style-type: upper-russian-full;"><li>222</li></ol> <ol start="333" class="high" lang="ru" style="list-style-type: upper-russian-full;"><li>333</li></ol> <ol start="444" class="high" lang="ru" style="list-style-type: upper-russian-full;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-russian-full', 'ru', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-serbian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-serbian"><a href="#lower-serbian">lower-serbian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-serbian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\452' '\435' '\436' '\437' '\438' '\458' '\43A' '\43B' '\459' '\43C' '\43D' '\45A' '\43E' '\43F' '\440' '\441' '\442' '\45B' '\443' '\444' '\445' '\446' '\447' '\45F' '\448'; /* symbols: 'а' 'б' 'в' 'г' 'д' 'ђ' 'е' 'ж' 'з' 'и' 'ј' 'к' 'л' 'љ' 'м' 'н' 'њ' 'о' 'п' 'р' 'с' 'т' 'ћ' 'у' 'ф' 'х' 'ц' 'ч' 'џ' 'ш'; */ suffix: ') '; } </bdo></code></p> <div id="out_lower-serbian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="sr" style="list-style-type: lower-serbian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="sr" style="list-style-type: lower-serbian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="sr" style="list-style-type: lower-serbian;"><li>11</li></ol> <ol start="22" class="high" lang="sr" style="list-style-type: lower-serbian;"><li>22</li></ol> <ol start="33" class="high" lang="sr" style="list-style-type: lower-serbian;"><li>33</li></ol> <ol start="44" class="high" lang="sr" style="list-style-type: lower-serbian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="sr" style="list-style-type: lower-serbian;"><li>111</li></ol> <ol start="222" class="high" lang="sr" style="list-style-type: lower-serbian;"><li>222</li></ol> <ol start="333" class="high" lang="sr" style="list-style-type: lower-serbian;"><li>333</li></ol> <ol start="444" class="high" lang="sr" style="list-style-type: lower-serbian;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-serbian', 'sr', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-serbian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-serbian"><a href="#upper-serbian">upper-serbian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-serbian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\402' '\415' '\416' '\417' '\418' '\408' '\41A' '\41B' '\409' '\41C' '\41D' '\40A' '\41E' '\41F' '\420' '\421' '\422' '\40B' '\423' '\424' '\425' '\426' '\427' '\40F' '\428'; /* symbols: 'А' 'Б' 'В' 'Г' 'Д' 'Ђ' 'Е' 'Ж' 'З' 'И' 'Ј' 'К' 'Л' 'Љ' 'М' 'Н' 'Њ' 'О' 'П' 'Р' 'С' 'Т' 'Ћ' 'У' 'Ф' 'Х' 'Ц' 'Ч' 'Џ' 'Ш'; */ } </bdo></code></p> <div id="out_upper-serbian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="sr" style="list-style-type: upper-serbian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="sr" style="list-style-type: upper-serbian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="sr" style="list-style-type: upper-serbian;"><li>11</li></ol> <ol start="22" class="high" lang="sr" style="list-style-type: upper-serbian;"><li>22</li></ol> <ol start="33" class="high" lang="sr" style="list-style-type: upper-serbian;"><li>33</li></ol> <ol start="44" class="high" lang="sr" style="list-style-type: upper-serbian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="sr" style="list-style-type: upper-serbian;"><li>111</li></ol> <ol start="222" class="high" lang="sr" style="list-style-type: upper-serbian;"><li>222</li></ol> <ol start="333" class="high" lang="sr" style="list-style-type: upper-serbian;"><li>333</li></ol> <ol start="444" class="high" lang="sr" style="list-style-type: upper-serbian;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-serbian', 'sr', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-ukrainian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-ukrainian"><a href="#lower-ukrainian">lower-ukrainian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-ukrainian { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\434' '\435' '\454' '\436' '\437' '\438' '\456' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\444' '\445' '\446' '\447' '\448' '\44E' '\44F'; /* symbols: 'а' 'б' 'в' 'г' 'д' 'е' 'є' 'ж' 'з' 'и' 'і' 'к' 'л' 'м' 'н' 'о' 'п' 'р' 'с' 'т' 'у' 'ф' 'х' 'ц' 'ч' 'ш' 'ю' 'я'; */ suffix: ') '; } </bdo></code></p> <div id="out_lower-ukrainian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="uk" style="list-style-type: lower-ukrainian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="uk" style="list-style-type: lower-ukrainian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="uk" style="list-style-type: lower-ukrainian;"><li>11</li></ol> <ol start="22" class="high" lang="uk" style="list-style-type: lower-ukrainian;"><li>22</li></ol> <ol start="33" class="high" lang="uk" style="list-style-type: lower-ukrainian;"><li>33</li></ol> <ol start="44" class="high" lang="uk" style="list-style-type: lower-ukrainian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="uk" style="list-style-type: lower-ukrainian;"><li>111</li></ol> <ol start="222" class="high" lang="uk" style="list-style-type: lower-ukrainian;"><li>222</li></ol> <ol start="333" class="high" lang="uk" style="list-style-type: lower-ukrainian;"><li>333</li></ol> <ol start="444" class="high" lang="uk" style="list-style-type: lower-ukrainian;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-ukrainian', 'uk', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-ukrainian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-ukrainian"><a href="#upper-ukrainian">upper-ukrainian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-ukrainian { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\414' '\415' '\404' '\416' '\417' '\418' '\406' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\424' '\425' '\426' '\427' '\428' '\42E' '\42F'; /* symbols: 'А' 'Б' 'В' 'Г' 'Д' 'Е' 'Є' 'Ж' 'З' 'И' 'І' 'К' 'Л' 'М' 'Н' 'О' 'П' 'Р' 'С' 'Т' 'У' 'Ф' 'Х' 'Ц' 'Ч' 'Ш' 'Ю' 'Я'; */ } </bdo></code></p> <div id="out_upper-ukrainian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="uk" style="list-style-type: upper-ukrainian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="uk" style="list-style-type: upper-ukrainian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="uk" style="list-style-type: upper-ukrainian;"><li>11</li></ol> <ol start="22" class="high" lang="uk" style="list-style-type: upper-ukrainian;"><li>22</li></ol> <ol start="33" class="high" lang="uk" style="list-style-type: upper-ukrainian;"><li>33</li></ol> <ol start="44" class="high" lang="uk" style="list-style-type: upper-ukrainian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="uk" style="list-style-type: upper-ukrainian;"><li>111</li></ol> <ol start="222" class="high" lang="uk" style="list-style-type: upper-ukrainian;"><li>222</li></ol> <ol start="333" class="high" lang="uk" style="list-style-type: upper-ukrainian;"><li>333</li></ol> <ol start="444" class="high" lang="uk" style="list-style-type: upper-ukrainian;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-ukrainian', 'uk', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-ukrainian-full')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-ukrainian-full"><a href="#lower-ukrainian-full">lower-ukrainian-full</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-ukrainian-full { system: alphabetic; symbols: '\430' '\431' '\432' '\433' '\491' '\434' '\435' '\454' '\436' '\437' '\438' '\456' '\457' '\439' '\43A' '\43B' '\43C' '\43D' '\43E' '\43F' '\440' '\441' '\442' '\443' '\444' '\445' '\446' '\447' '\448' '\449' '\44C' '\44E' '\44F'; /* symbols: 'а' 'б' 'в' 'г' 'ґ' 'д' 'е' 'є' 'ж' 'з' 'и' 'і' 'ї' 'й' 'к' 'л' 'м' 'н' 'о' 'п' 'р' 'с' 'т' 'у' 'ф' 'х' 'ц' 'ч' 'ш' 'щ' 'ь' 'ю' 'я'; */ suffix: ') '; } </bdo></code></p> <div id="out_lower-ukrainian-full" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="uk" style="list-style-type: lower-ukrainian-full; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="uk" style="list-style-type: lower-ukrainian-full; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="uk" style="list-style-type: lower-ukrainian-full;"><li>11</li></ol> <ol start="22" class="high" lang="uk" style="list-style-type: lower-ukrainian-full;"><li>22</li></ol> <ol start="33" class="high" lang="uk" style="list-style-type: lower-ukrainian-full;"><li>33</li></ol> <ol start="44" class="high" lang="uk" style="list-style-type: lower-ukrainian-full;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="uk" style="list-style-type: lower-ukrainian-full;"><li>111</li></ol> <ol start="222" class="high" lang="uk" style="list-style-type: lower-ukrainian-full;"><li>222</li></ol> <ol start="333" class="high" lang="uk" style="list-style-type: lower-ukrainian-full;"><li>333</li></ol> <ol start="444" class="high" lang="uk" style="list-style-type: lower-ukrainian-full;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-ukrainian-full', 'uk', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-ukrainian-full')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-ukrainian-full"><a href="#upper-ukrainian-full">upper-ukrainian-full</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-ukrainian-full { system: alphabetic; symbols: '\410' '\411' '\412' '\413' '\490' '\414' '\415' '\404' '\416' '\417' '\418' '\406' '\407' '\419' '\41A' '\41B' '\41C' '\41D' '\41E' '\41F' '\420' '\421' '\422' '\423' '\424' '\425' '\426' '\427' '\428' '\429' '\42C' '\42E' '\42F'; /* symbols: 'А' 'Б' 'В' 'Г' 'Ґ' 'Д' 'Е' 'Є' 'Ж' 'З' 'И' 'І' 'Ї' 'Й' 'К' 'Л' 'М' 'Н' 'О' 'П' 'Р' 'С' 'Т' 'У' 'Ф' 'Х' 'Ц' 'Ч' 'Ш' 'Щ' 'Ь' 'Ю' 'Я'; */ } </bdo></code></p> <div id="out_upper-ukrainian-full" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="uk" style="list-style-type: upper-ukrainian-full; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="uk" style="list-style-type: upper-ukrainian-full; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="uk" style="list-style-type: upper-ukrainian-full;"><li>11</li></ol> <ol start="22" class="high" lang="uk" style="list-style-type: upper-ukrainian-full;"><li>22</li></ol> <ol start="33" class="high" lang="uk" style="list-style-type: upper-ukrainian-full;"><li>33</li></ol> <ol start="44" class="high" lang="uk" style="list-style-type: upper-ukrainian-full;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="uk" style="list-style-type: upper-ukrainian-full;"><li>111</li></ol> <ol start="222" class="high" lang="uk" style="list-style-type: upper-ukrainian-full;"><li>222</li></ol> <ol start="333" class="high" lang="uk" style="list-style-type: upper-ukrainian-full;"><li>333</li></ol> <ol start="444" class="high" lang="uk" style="list-style-type: upper-ukrainian-full;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-ukrainian-full', 'uk', '')</script> </div> </section> <section id="devanagari-styles"><div class="header-wrapper"><h2 id="x10-devanagari"><bdi class="secno">10. </bdi>Devanagari</h2><a class="self-link" href="#devanagari-styles" aria-label="Permalink for Section 10."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('bodo')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="bodo"><a href="#bodo">bodo</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style bodo { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' ; /* symbols: 'क' 'ख' 'ग' 'घ' 'ङ' 'च' 'छ' 'ज' 'झ' 'ञ' 'ट' 'ठ' 'ड' 'ढ' 'ण' 'त' 'थ' 'द' 'ध' 'न' 'प' 'फ' 'ब' 'भ' 'म' 'य' 'र' 'ल' 'व' 'श' 'ष' 'स' 'ह' */ suffix: ') '; } </bdo></code></p> <div id="out_bodo" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="brx" style="list-style-type: bodo; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="brx" style="list-style-type: bodo; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="brx" style="list-style-type: bodo;"><li>11</li></ol> <ol start="22" class="high" lang="brx" style="list-style-type: bodo;"><li>22</li></ol> <ol start="33" class="high" lang="brx" style="list-style-type: bodo;"><li>33</li></ol> <ol start="44" class="high" lang="brx" style="list-style-type: bodo;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="brx" style="list-style-type: bodo;"><li>111</li></ol> <ol start="222" class="high" lang="brx" style="list-style-type: bodo;"><li>222</li></ol> <ol start="333" class="high" lang="brx" style="list-style-type: bodo;"><li>333</li></ol> <ol start="444" class="high" lang="brx" style="list-style-type: bodo;"><li>444</li></ol></div> </div></div> <script>addExamples('bodo', 'brx', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-10"><div role="heading" class="note-title marker" id="h-note-10" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">bodo</code> style uses identical counters to the <code class="kw" translate="no">hindi</code> style. The marker should be surrounded by parentheses if the list size exceeds the number of letters, eg. (<span lang="brx">कक</span>).</p> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style bodo-dbl-paren { system: extends bodo; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('devanagari')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="devanagari"><a href="#devanagari">devanagari</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style devanagari { system: numeric; symbols: '\966' '\967' '\968' '\969' '\96A' '\96B' '\96C' '\96D' '\96E' '\96F'; /* symbols: '०' '१' '२' '३' '४' '५' '६' '७' '८' '९'; */ } </bdo></code></p> <div id="out_devanagari" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="hi" style="list-style-type: devanagari; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="hi" style="list-style-type: devanagari; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="hi" style="list-style-type: devanagari;"><li>11</li></ol> <ol start="22" class="high" lang="hi" style="list-style-type: devanagari;"><li>22</li></ol> <ol start="33" class="high" lang="hi" style="list-style-type: devanagari;"><li>33</li></ol> <ol start="44" class="high" lang="hi" style="list-style-type: devanagari;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="hi" style="list-style-type: devanagari;"><li>111</li></ol> <ol start="222" class="high" lang="hi" style="list-style-type: devanagari;"><li>222</li></ol> <ol start="333" class="high" lang="hi" style="list-style-type: devanagari;"><li>333</li></ol> <ol start="444" class="high" lang="hi" style="list-style-type: devanagari;"><li>444</li></ol></div> </div></div> <script>addExamples('devanagari', 'hi', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-11"><div role="heading" class="note-title marker" id="h-note-11" aria-level="3"><span>Note</span></div><aside class=""><p>The <code class="kw" translate="no">devanagari</code> style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">devanagari</a></code> style.</p></aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('dogri')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="dogri"><a href="#dogri">dogri</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style dogri { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939'; /* symbols: 'क' 'ख' 'ग' 'घ' 'ङ' 'च' 'छ' 'ज' 'झ' 'ञ' 'ट' 'ठ' 'ड' 'ढ' 'ण' 'त' 'थ' 'द' 'ध' 'न' 'प' 'फ' 'ब' 'भ' 'म' 'य' 'र' 'ल' 'व' 'श' 'ष' 'स' 'ह' */ suffix: ') '; } </bdo></code></p> <div id="out_dogri" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="dgo" style="list-style-type: dogri; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="dgo" style="list-style-type: dogri; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="dgo" style="list-style-type: dogri;"><li>11</li></ol> <ol start="22" class="high" lang="dgo" style="list-style-type: dogri;"><li>22</li></ol> <ol start="33" class="high" lang="dgo" style="list-style-type: dogri;"><li>33</li></ol> <ol start="44" class="high" lang="dgo" style="list-style-type: dogri;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="dgo" style="list-style-type: dogri;"><li>111</li></ol> <ol start="222" class="high" lang="dgo" style="list-style-type: dogri;"><li>222</li></ol> <ol start="333" class="high" lang="dgo" style="list-style-type: dogri;"><li>333</li></ol> <ol start="444" class="high" lang="dgo" style="list-style-type: dogri;"><li>444</li></ol></div> </div></div> <script>addExamples('dogri', 'dgo', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-12"><div role="heading" class="note-title marker" id="h-note-12" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">dogri</code> style uses identical counters to the <code class="kw" translate="no">hindi</code> style.</p> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style dogri-dbl-paren { system: extends dogri; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('hindi')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="hindi"><a href="#hindi">hindi</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style hindi { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939'; /* symbols: 'क' 'ख' 'ग' 'घ' 'ङ' 'च' 'छ' 'ज' 'झ' 'ञ' 'ट' 'ठ' 'ड' 'ढ' 'ण' 'त' 'थ' 'द' 'ध' 'न' 'प' 'फ' 'ब' 'भ' 'म' 'य' 'र' 'ल' 'व' 'श' 'ष' 'स' 'ह'; */ } </bdo></code></p> <div id="out_hindi" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="hi" style="list-style-type: hindi; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="hi" style="list-style-type: hindi; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="hi" style="list-style-type: hindi;"><li>11</li></ol> <ol start="22" class="high" lang="hi" style="list-style-type: hindi;"><li>22</li></ol> <ol start="33" class="high" lang="hi" style="list-style-type: hindi;"><li>33</li></ol> <ol start="44" class="high" lang="hi" style="list-style-type: hindi;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="hi" style="list-style-type: hindi;"><li>111</li></ol> <ol start="222" class="high" lang="hi" style="list-style-type: hindi;"><li>222</li></ol> <ol start="333" class="high" lang="hi" style="list-style-type: hindi;"><li>333</li></ol> <ol start="444" class="high" lang="hi" style="list-style-type: hindi;"><li>444</li></ol></div> </div></div> <script>addExamples('hindi', 'hi', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('konkani')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="konkani"><a href="#konkani">konkani</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style konkani { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' '\933'; /* symbols: 'क' 'ख' 'ग' 'घ' 'ङ' 'च' 'छ' 'ज' 'झ' 'ञ' 'ट' 'ठ' 'ड' 'ढ' 'ण' 'त' 'थ' 'द' 'ध' 'न' 'प' 'फ' 'ब' 'भ' 'म' 'य' 'र' 'ल' 'व' 'श' 'ष' 'स' 'ह' 'ळ' ; */ suffix: ') '; } </bdo></code></p> <div id="out_konkani" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="knn" style="list-style-type: konkani; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="knn" style="list-style-type: konkani; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="knn" style="list-style-type: konkani;"><li>11</li></ol> <ol start="22" class="high" lang="knn" style="list-style-type: konkani;"><li>22</li></ol> <ol start="33" class="high" lang="knn" style="list-style-type: konkani;"><li>33</li></ol> <ol start="44" class="high" lang="knn" style="list-style-type: konkani;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="knn" style="list-style-type: konkani;"><li>111</li></ol> <ol start="222" class="high" lang="knn" style="list-style-type: konkani;"><li>222</li></ol> <ol start="333" class="high" lang="knn" style="list-style-type: konkani;"><li>333</li></ol> <ol start="444" class="high" lang="knn" style="list-style-type: konkani;"><li>444</li></ol></div> </div></div> <script>addExamples('konkani', 'knn', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-13"><div role="heading" class="note-title marker" id="h-note-13" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">konkani</code> style uses one more counter than the <code class="kw" translate="no">hindi</code> style (ळ). This makes it the same as the <code class="kw" translate="no">marathi</code> style.</p> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style konkani-dbl-paren { system: extends konkani; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('maithili')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="maithili"><a href="#maithili">maithili</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style maithili { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' ; /* symbols: 'क' 'ख' 'ग' 'घ' 'ङ' 'च' 'छ' 'ज' 'झ' 'ञ' 'ट' 'ठ' 'ड' 'ढ' 'ण' 'त' 'थ' 'द' 'ध' 'न' 'प' 'फ' 'ब' 'भ' 'म' 'य' 'र' 'ल' 'व' 'श' 'ष' 'स' 'ह' */ suffix: ') '; } </bdo></code></p> <div id="out_maithili" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="mai" style="list-style-type: maithili; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="mai" style="list-style-type: maithili; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="mai" style="list-style-type: maithili;"><li>11</li></ol> <ol start="22" class="high" lang="mai" style="list-style-type: maithili;"><li>22</li></ol> <ol start="33" class="high" lang="mai" style="list-style-type: maithili;"><li>33</li></ol> <ol start="44" class="high" lang="mai" style="list-style-type: maithili;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="mai" style="list-style-type: maithili;"><li>111</li></ol> <ol start="222" class="high" lang="mai" style="list-style-type: maithili;"><li>222</li></ol> <ol start="333" class="high" lang="mai" style="list-style-type: maithili;"><li>333</li></ol> <ol start="444" class="high" lang="mai" style="list-style-type: maithili;"><li>444</li></ol></div> </div></div> <script>addExamples('maithili', 'mai', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-14"><div role="heading" class="note-title marker" id="h-note-14" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">maithili</code> style uses identical counters to the <code class="kw" translate="no">hindi</code> style.</p> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br>Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style maithili-dbl-paren { system: extends maithili; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('marathi')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="marathi"><a href="#marathi">marathi</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style marathi { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' '\933'; /* symbols: 'क' 'ख' 'ग' 'घ' 'ङ' 'च' 'छ' 'ज' 'झ' 'ञ' 'ट' 'ठ' 'ड' 'ढ' 'ण' 'त' 'थ' 'द' 'ध' 'न' 'प' 'फ' 'ब' 'भ' 'म' 'य' 'र' 'ल' 'व' 'श' 'ष' 'स' 'ह' 'ळ' ; */ suffix: ') '; } </bdo></code></p> <div id="out_marathi" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="mr" style="list-style-type: marathi; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="mr" style="list-style-type: marathi; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="mr" style="list-style-type: marathi;"><li>11</li></ol> <ol start="22" class="high" lang="mr" style="list-style-type: marathi;"><li>22</li></ol> <ol start="33" class="high" lang="mr" style="list-style-type: marathi;"><li>33</li></ol> <ol start="44" class="high" lang="mr" style="list-style-type: marathi;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="mr" style="list-style-type: marathi;"><li>111</li></ol> <ol start="222" class="high" lang="mr" style="list-style-type: marathi;"><li>222</li></ol> <ol start="333" class="high" lang="mr" style="list-style-type: marathi;"><li>333</li></ol> <ol start="444" class="high" lang="mr" style="list-style-type: marathi;"><li>444</li></ol></div> </div></div> <script>addExamples('marathi', 'mr', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-15"><div role="heading" class="note-title marker" id="h-note-15" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">marathi</code> style uses one more counter than the <code class="kw" translate="no">hindi</code> style (ळ). This makes it the same as the <code class="kw" translate="no">konkani</code> style.</p> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style marathi-dbl-paren { system: extends marathi; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('sanskrit')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="sanskrit"><a href="#sanskrit">sanskrit</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style sanskrit { system: alphabetic; symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' ; /* symbols: 'क' 'ख' 'ग' 'घ' 'ङ' 'च' 'छ' 'ज' 'झ' 'ञ' 'ट' 'ठ' 'ड' 'ढ' 'ण' 'त' 'थ' 'द' 'ध' 'न' 'प' 'फ' 'ब' 'भ' 'म' 'य' 'र' 'ल' 'व' 'श' 'ष' 'स' 'ह'; */ suffix: ') '; } </bdo></code></p> <div id="out_sanskrit" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="sa" style="list-style-type: sanskrit; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="sa" style="list-style-type: sanskrit; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="sa" style="list-style-type: sanskrit;"><li>11</li></ol> <ol start="22" class="high" lang="sa" style="list-style-type: sanskrit;"><li>22</li></ol> <ol start="33" class="high" lang="sa" style="list-style-type: sanskrit;"><li>33</li></ol> <ol start="44" class="high" lang="sa" style="list-style-type: sanskrit;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="sa" style="list-style-type: sanskrit;"><li>111</li></ol> <ol start="222" class="high" lang="sa" style="list-style-type: sanskrit;"><li>222</li></ol> <ol start="333" class="high" lang="sa" style="list-style-type: sanskrit;"><li>333</li></ol> <ol start="444" class="high" lang="sa" style="list-style-type: sanskrit;"><li>444</li></ol></div> </div></div> <script>addExamples('sanskrit', 'sa', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-16"><div role="heading" class="note-title marker" id="h-note-16" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">sanskrit</code> style uses identical counters to the <code class="kw" translate="no">hindi</code> style.</p> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style sanskrit-dbl-paren { system: extends sanskrit; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('sindhi')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="sindhi"><a href="#sindhi">sindhi</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style sindhi { system: alphabetic; symbols: '\0915' '\0916' '\0916 \093C' '\0917' '\097B' '\0917 \093C' '\0918' '\0919' '\091A' '\091B' '\091C' '\097C' '\091C\093C' '\091D' '\091E' '\091F' '\0920' '\0921' '\097E' '\0921\093C' '\0922' '\0922 \093C' '\0923' '\0924' '\0925' '\0926' '\0927' '\0928' '\092A' '\092B' '\092B\093C' '\092C' '\097F' '\092D' '\092E' '\092F' '\0930' '\0932' '\0935' '\0936' '\0937' '\0938' '\0939' ; /* symbols: 'क' 'ख' 'ख़' 'ग' 'ॻ' 'ग़' 'घ' 'ङ' 'च' 'छ' 'ज' 'ॼ' 'ज़' 'झ' 'ञ' 'ट' 'ठ' 'ड' 'ॾ' 'ड़' 'ढ' 'ढ़' 'ण' 'त' 'थ' 'द' 'ध' 'न' 'प' 'फ' 'फ़' 'ब' 'ॿ' 'भ' 'म' 'य' 'र' 'ल' 'व' 'श' 'ष' 'स' 'ह' ; */ suffix: ') '; } </bdo></code></p> <div id="out_sindhi" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="sd" style="list-style-type: sindhi; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="sd" style="list-style-type: sindhi; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="sd" style="list-style-type: sindhi;"><li>11</li></ol> <ol start="22" class="high" lang="sd" style="list-style-type: sindhi;"><li>22</li></ol> <ol start="33" class="high" lang="sd" style="list-style-type: sindhi;"><li>33</li></ol> <ol start="44" class="high" lang="sd" style="list-style-type: sindhi;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="sd" style="list-style-type: sindhi;"><li>111</li></ol> <ol start="222" class="high" lang="sd" style="list-style-type: sindhi;"><li>222</li></ol> <ol start="333" class="high" lang="sd" style="list-style-type: sindhi;"><li>333</li></ol> <ol start="444" class="high" lang="sd" style="list-style-type: sindhi;"><li>444</li></ol></div> </div></div> <script>addExamples('sindhi', 'sd', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-17"><div role="heading" class="note-title marker" id="h-note-17" aria-level="3"><span>Note</span></div><aside class=""> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style sindhi-dbl-paren { system: extends sindhi; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> </section> <section id="ethiopic-styles"><div class="header-wrapper"><h2 id="x11-ethiopic"><bdi class="secno">11. </bdi>Ethiopic</h2><a class="self-link" href="#ethiopic-styles" aria-label="Permalink for Section 11."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('afar')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="afar"><a href="#afar">afar</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style afar { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1260' '\1270' '\1290' '\12A0' '\12A8' '\12C8' '\12D0' '\12E8' '\12F0' '\12F8' '\1308' '\1338' '\1348'; /* symbols: 'ሀ' 'ለ' 'ሐ' 'መ' 'ረ' 'ሰ' 'በ' 'ተ' 'ነ' 'አ' 'ከ' 'ወ' 'ዐ' 'የ' 'ደ' 'ዸ' 'ገ' 'ጸ' 'ፈ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_afar" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="aa" style="list-style-type: afar; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="aa" style="list-style-type: afar; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="aa" style="list-style-type: afar;"><li>11</li></ol> <ol start="22" class="high" lang="aa" style="list-style-type: afar;"><li>22</li></ol> <ol start="33" class="high" lang="aa" style="list-style-type: afar;"><li>33</li></ol> <ol start="44" class="high" lang="aa" style="list-style-type: afar;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="aa" style="list-style-type: afar;"><li>111</li></ol> <ol start="222" class="high" lang="aa" style="list-style-type: afar;"><li>222</li></ol> <ol start="333" class="high" lang="aa" style="list-style-type: afar;"><li>333</li></ol> <ol start="444" class="high" lang="aa" style="list-style-type: afar;"><li>444</li></ol></div> </div></div> <script>addExamples('afar', 'aa', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('agaw')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="agaw"><a href="#agaw">agaw</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style agaw { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1238' '\1240' '\1250' '\1260' '\1268' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308' '\1318' '\1320' '\1328' '\1330' '\1338' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'ሐ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'ቐ' 'በ' 'ቨ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'ጀ' 'ገ' 'ጘ' 'ጠ' 'ጨ' 'ጰ' 'ጸ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_agaw" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="und" style="list-style-type: agaw; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="und" style="list-style-type: agaw; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="und" style="list-style-type: agaw;"><li>11</li></ol> <ol start="22" class="high" lang="und" style="list-style-type: agaw;"><li>22</li></ol> <ol start="33" class="high" lang="und" style="list-style-type: agaw;"><li>33</li></ol> <ol start="44" class="high" lang="und" style="list-style-type: agaw;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="und" style="list-style-type: agaw;"><li>111</li></ol> <ol start="222" class="high" lang="und" style="list-style-type: agaw;"><li>222</li></ol> <ol start="333" class="high" lang="und" style="list-style-type: agaw;"><li>333</li></ol> <ol start="444" class="high" lang="und" style="list-style-type: agaw;"><li>444</li></ol></div> </div></div> <script>addExamples('agaw', 'und', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('ari')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="ari"><a href="#ari">ari</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style ari { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1260' '\1268' '\1270' '\1278' '\1290' '\1300' '\1308' '\1328' '\1340' '\1350'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'በ' 'ቨ' 'ተ' 'ቸ' 'ነ' 'ጀ' 'ገ' 'ጨ' 'ፀ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_ari" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="aiw" style="list-style-type: ari; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="aiw" style="list-style-type: ari; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="aiw" style="list-style-type: ari;"><li>11</li></ol> <ol start="22" class="high" lang="aiw" style="list-style-type: ari;"><li>22</li></ol> <ol start="33" class="high" lang="aiw" style="list-style-type: ari;"><li>33</li></ol> <ol start="44" class="high" lang="aiw" style="list-style-type: ari;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="aiw" style="list-style-type: ari;"><li>111</li></ol> <ol start="222" class="high" lang="aiw" style="list-style-type: ari;"><li>222</li></ol> <ol start="333" class="high" lang="aiw" style="list-style-type: ari;"><li>333</li></ol> <ol start="444" class="high" lang="aiw" style="list-style-type: ari;"><li>444</li></ol></div> </div></div> <script>addExamples('ari', 'aiw', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('blin')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="blin"><a href="#blin">blin</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style blin { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1230' '\1238' '\1228' '\1240' '\1250' '\1260' '\1270' '\1290' '\1300' '\1308' '\1318' '\1320' '\1328' '\1348' '\1278' '\1298' '\1338' '\1330' '\1350'; /* symbols: 'ሀ' 'ለ' 'ሐ' 'መ' 'ሰ' 'ሸ' 'ረ' 'ቀ' 'ቐ' 'በ' 'ተ' 'ነ' 'ጀ' 'ገ' 'ጘ' 'ጠ' 'ጨ' 'ፈ' 'ቸ' 'ኘ' 'ጸ' 'ጰ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_blin" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="byn" style="list-style-type: blin; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="byn" style="list-style-type: blin; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="byn" style="list-style-type: blin;"><li>11</li></ol> <ol start="22" class="high" lang="byn" style="list-style-type: blin;"><li>22</li></ol> <ol start="33" class="high" lang="byn" style="list-style-type: blin;"><li>33</li></ol> <ol start="44" class="high" lang="byn" style="list-style-type: blin;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="byn" style="list-style-type: blin;"><li>111</li></ol> <ol start="222" class="high" lang="byn" style="list-style-type: blin;"><li>222</li></ol> <ol start="333" class="high" lang="byn" style="list-style-type: blin;"><li>333</li></ol> <ol start="444" class="high" lang="byn" style="list-style-type: blin;"><li>444</li></ol></div> </div></div> <script>addExamples('blin', 'byn', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('dizi')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="dizi"><a href="#dizi">dizi</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style dizi { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308' '\1320' '\1328' '\1338' '\1340' '\1348'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጸ' 'ፀ' 'ፈ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_dizi" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="mdx" style="list-style-type: dizi; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="mdx" style="list-style-type: dizi; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="mdx" style="list-style-type: dizi;"><li>11</li></ol> <ol start="22" class="high" lang="mdx" style="list-style-type: dizi;"><li>22</li></ol> <ol start="33" class="high" lang="mdx" style="list-style-type: dizi;"><li>33</li></ol> <ol start="44" class="high" lang="mdx" style="list-style-type: dizi;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="mdx" style="list-style-type: dizi;"><li>111</li></ol> <ol start="222" class="high" lang="mdx" style="list-style-type: dizi;"><li>222</li></ol> <ol start="333" class="high" lang="mdx" style="list-style-type: dizi;"><li>333</li></ol> <ol start="444" class="high" lang="mdx" style="list-style-type: dizi;"><li>444</li></ol></div> </div></div> <script>addExamples('dizi', 'mdx', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('ethiopic-halehame')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="ethiopic-halehame"><a href="#ethiopic-halehame">ethiopic-halehame</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style ethiopic-halehame { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1240' '\1260' '\1270' '\1280' '\1290' '\12A0' '\12A8' '\12C8' '\12D0' '\12D8' '\12E8' '\12F0' '\1308' '\1320' '\1330' '\1338' '\1340' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'ሐ' 'መ' 'ሠ' 'ረ' 'ሰ' 'ቀ' 'በ' 'ተ' 'ኀ' 'ነ' 'አ' 'ከ' 'ወ' 'ዐ' 'ዘ' 'የ' 'ደ' 'ገ' 'ጠ' 'ጰ' 'ጸ' 'ፀ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_ethiopic-halehame" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="am" style="list-style-type: ethiopic-halehame; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="am" style="list-style-type: ethiopic-halehame; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="am" style="list-style-type: ethiopic-halehame;"><li>11</li></ol> <ol start="22" class="high" lang="am" style="list-style-type: ethiopic-halehame;"><li>22</li></ol> <ol start="33" class="high" lang="am" style="list-style-type: ethiopic-halehame;"><li>33</li></ol> <ol start="44" class="high" lang="am" style="list-style-type: ethiopic-halehame;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="am" style="list-style-type: ethiopic-halehame;"><li>111</li></ol> <ol start="222" class="high" lang="am" style="list-style-type: ethiopic-halehame;"><li>222</li></ol> <ol start="333" class="high" lang="am" style="list-style-type: ethiopic-halehame;"><li>333</li></ol> <ol start="444" class="high" lang="am" style="list-style-type: ethiopic-halehame;"><li>444</li></ol></div> </div></div> <script>addExamples('ethiopic-halehame', 'am', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('ethiopic-halehame-am')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="ethiopic-halehame-am"><a href="#ethiopic-halehame-am">ethiopic-halehame-am</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style ethiopic-halehame-am { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1280' '\1290' '\1298' '\12A0' '\12A8' '\12B8' '\12C8' '\12D0' '\12D8' '\12E0' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1340' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'ሐ' 'መ' 'ሠ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ኀ' 'ነ' 'ኘ' 'አ' 'ከ' 'ኸ' 'ወ' 'ዐ' 'ዘ' 'ዠ' 'የ' 'ደ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ጸ' 'ፀ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_ethiopic-halehame-am" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="am" style="list-style-type: ethiopic-halehame-am; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="am" style="list-style-type: ethiopic-halehame-am; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="am" style="list-style-type: ethiopic-halehame-am;"><li>11</li></ol> <ol start="22" class="high" lang="am" style="list-style-type: ethiopic-halehame-am;"><li>22</li></ol> <ol start="33" class="high" lang="am" style="list-style-type: ethiopic-halehame-am;"><li>33</li></ol> <ol start="44" class="high" lang="am" style="list-style-type: ethiopic-halehame-am;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="am" style="list-style-type: ethiopic-halehame-am;"><li>111</li></ol> <ol start="222" class="high" lang="am" style="list-style-type: ethiopic-halehame-am;"><li>222</li></ol> <ol start="333" class="high" lang="am" style="list-style-type: ethiopic-halehame-am;"><li>333</li></ol> <ol start="444" class="high" lang="am" style="list-style-type: ethiopic-halehame-am;"><li>444</li></ol></div> </div></div> <script>addExamples('ethiopic-halehame-am', 'am', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('ethiopic-halehame-ti-er')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="ethiopic-halehame-ti-er"><a href="#ethiopic-halehame-ti-er">ethiopic-halehame-ti-er</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style ethiopic-halehame-ti-er { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1238' '\1240' '\1250' '\1260' '\1270' '\1278' '\1290' '\1298' '\12A0' '\12A8' '\12B8' '\12C8' '\12D0' '\12D8' '\12E0' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'ሐ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'ቐ' 'በ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'አ' 'ከ' 'ኸ' 'ወ' 'ዐ' 'ዘ' 'ዠ' 'የ' 'ደ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ጸ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_ethiopic-halehame-ti-er" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ti" style="list-style-type: ethiopic-halehame-ti-er; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ti" style="list-style-type: ethiopic-halehame-ti-er; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-er;"><li>11</li></ol> <ol start="22" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-er;"><li>22</li></ol> <ol start="33" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-er;"><li>33</li></ol> <ol start="44" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-er;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-er;"><li>111</li></ol> <ol start="222" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-er;"><li>222</li></ol> <ol start="333" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-er;"><li>333</li></ol> <ol start="444" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-er;"><li>444</li></ol></div> </div></div> <script>addExamples('ethiopic-halehame-ti-er', 'ti', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('ethiopic-halehame-ti-et')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="ethiopic-halehame-ti-et"><a href="#ethiopic-halehame-ti-et">ethiopic-halehame-ti-et</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style ethiopic-halehame-ti-et { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1238' '\1240' '\1250' '\1260' '\1270' '\1278' '\1280' '\1290' '\1298' '\12A0' '\12A8' '\12B8' '\12C8' '\12D0' '\12D8' '\12E0' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1340' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'ሐ' 'መ' 'ሠ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'ቐ' 'በ' 'ተ' 'ቸ' 'ኀ' 'ነ' 'ኘ' 'አ' 'ከ' 'ኸ' 'ወ' 'ዐ' 'ዘ' 'ዠ' 'የ' 'ደ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ጸ' 'ፀ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_ethiopic-halehame-ti-et" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ti" style="list-style-type: ethiopic-halehame-ti-et; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ti" style="list-style-type: ethiopic-halehame-ti-et; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-et;"><li>11</li></ol> <ol start="22" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-et;"><li>22</li></ol> <ol start="33" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-et;"><li>33</li></ol> <ol start="44" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-et;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-et;"><li>111</li></ol> <ol start="222" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-et;"><li>222</li></ol> <ol start="333" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-et;"><li>333</li></ol> <ol start="444" class="high" lang="ti" style="list-style-type: ethiopic-halehame-ti-et;"><li>444</li></ol></div> </div></div> <script>addExamples('ethiopic-halehame-ti-et', 'ti', '')</script> </div> <div class="csWrapper"> <p class="name" id="ethiopic-numeric"><a href="#ethiopic-numeric">ethiopic-numeric</a></p> <div id="out_ethiopic-numeric" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="am" style="list-style-type: ethiopic-numeric; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="am" style="list-style-type: ethiopic-numeric; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="am" style="list-style-type: ethiopic-numeric;"><li>11</li></ol> <ol start="22" class="high" lang="am" style="list-style-type: ethiopic-numeric;"><li>22</li></ol> <ol start="33" class="high" lang="am" style="list-style-type: ethiopic-numeric;"><li>33</li></ol> <ol start="44" class="high" lang="am" style="list-style-type: ethiopic-numeric;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="am" style="list-style-type: ethiopic-numeric;"><li>111</li></ol> <ol start="222" class="high" lang="am" style="list-style-type: ethiopic-numeric;"><li>222</li></ol> <ol start="333" class="high" lang="am" style="list-style-type: ethiopic-numeric;"><li>333</li></ol> <ol start="444" class="high" lang="am" style="list-style-type: ethiopic-numeric;"><li>444</li></ol></div> </div></div> <script>addExamples('ethiopic-numeric', 'am', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-18"><div role="heading" class="note-title marker" id="h-note-18" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">ethiopic-numeric</code> style follows special rules that are described in the <a href="https://www.w3.org/TR/css-counter-styles-3/#ethiopic-numeric-counter-style" target="_blank">Counter Styles specification</a>.</p> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('gedeo')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="gedeo"><a href="#gedeo">gedeo</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style gedeo { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ጸ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_gedeo" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="drs" style="list-style-type: gedeo; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="drs" style="list-style-type: gedeo; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="drs" style="list-style-type: gedeo;"><li>11</li></ol> <ol start="22" class="high" lang="drs" style="list-style-type: gedeo;"><li>22</li></ol> <ol start="33" class="high" lang="drs" style="list-style-type: gedeo;"><li>33</li></ol> <ol start="44" class="high" lang="drs" style="list-style-type: gedeo;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="drs" style="list-style-type: gedeo;"><li>111</li></ol> <ol start="222" class="high" lang="drs" style="list-style-type: gedeo;"><li>222</li></ol> <ol start="333" class="high" lang="drs" style="list-style-type: gedeo;"><li>333</li></ol> <ol start="444" class="high" lang="drs" style="list-style-type: gedeo;"><li>444</li></ol></div> </div></div> <script>addExamples('gedeo', 'drs', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('gumuz')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="gumuz"><a href="#gumuz">gumuz</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style gumuz { system: alphabetic; symbols: '\1200' '\1210' '\1208' '\1210' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1268' '\1270' '\1278' '\1290' '\1298' '\1308' '\1328' '\1330' '\1340' '\1350'; /* symbols: 'ሀ' 'ሐ' 'ለ' 'ሐ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ቨ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'ገ' 'ጨ' 'ጰ' 'ፀ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_gumuz" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="guk" style="list-style-type: gumuz; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="guk" style="list-style-type: gumuz; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="guk" style="list-style-type: gumuz;"><li>11</li></ol> <ol start="22" class="high" lang="guk" style="list-style-type: gumuz;"><li>22</li></ol> <ol start="33" class="high" lang="guk" style="list-style-type: gumuz;"><li>33</li></ol> <ol start="44" class="high" lang="guk" style="list-style-type: gumuz;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="guk" style="list-style-type: gumuz;"><li>111</li></ol> <ol start="222" class="high" lang="guk" style="list-style-type: gumuz;"><li>222</li></ol> <ol start="333" class="high" lang="guk" style="list-style-type: gumuz;"><li>333</li></ol> <ol start="444" class="high" lang="guk" style="list-style-type: gumuz;"><li>444</li></ol></div> </div></div> <script>addExamples('gumuz', 'guk', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('hadiyya')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="hadiyya"><a href="#hadiyya">hadiyya</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style hadiyya { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1300' '\1308' '\1320' '\1328' '\1330' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_hadiyya" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="hdy" style="list-style-type: hadiyya; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="hdy" style="list-style-type: hadiyya; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="hdy" style="list-style-type: hadiyya;"><li>11</li></ol> <ol start="22" class="high" lang="hdy" style="list-style-type: hadiyya;"><li>22</li></ol> <ol start="33" class="high" lang="hdy" style="list-style-type: hadiyya;"><li>33</li></ol> <ol start="44" class="high" lang="hdy" style="list-style-type: hadiyya;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="hdy" style="list-style-type: hadiyya;"><li>111</li></ol> <ol start="222" class="high" lang="hdy" style="list-style-type: hadiyya;"><li>222</li></ol> <ol start="333" class="high" lang="hdy" style="list-style-type: hadiyya;"><li>333</li></ol> <ol start="444" class="high" lang="hdy" style="list-style-type: hadiyya;"><li>444</li></ol></div> </div></div> <script>addExamples('hadiyya', 'hdy', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('harari')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="harari"><a href="#harari">harari</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style harari { system: alphabetic; symbols: '\1210' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308' '\1320' '\1328' '\1348'; /* symbols: 'ሐ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ፈ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_harari" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="har" style="list-style-type: harari; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="har" style="list-style-type: harari; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="har" style="list-style-type: harari;"><li>11</li></ol> <ol start="22" class="high" lang="har" style="list-style-type: harari;"><li>22</li></ol> <ol start="33" class="high" lang="har" style="list-style-type: harari;"><li>33</li></ol> <ol start="44" class="high" lang="har" style="list-style-type: harari;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="har" style="list-style-type: harari;"><li>111</li></ol> <ol start="222" class="high" lang="har" style="list-style-type: harari;"><li>222</li></ol> <ol start="333" class="high" lang="har" style="list-style-type: harari;"><li>333</li></ol> <ol start="444" class="high" lang="har" style="list-style-type: harari;"><li>444</li></ol></div> </div></div> <script>addExamples('harari', 'har', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('kaffa')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="kaffa"><a href="#kaffa">kaffa</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style kaffa { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1280' '\1290' '\1300' '\1308' '\1320' '\1328' '\1330' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'ሐ' 'መ' 'ሠ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ኀ' 'ነ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_kaffa" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="kbr" style="list-style-type: kaffa; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="kbr" style="list-style-type: kaffa; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="kbr" style="list-style-type: kaffa;"><li>11</li></ol> <ol start="22" class="high" lang="kbr" style="list-style-type: kaffa;"><li>22</li></ol> <ol start="33" class="high" lang="kbr" style="list-style-type: kaffa;"><li>33</li></ol> <ol start="44" class="high" lang="kbr" style="list-style-type: kaffa;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="kbr" style="list-style-type: kaffa;"><li>111</li></ol> <ol start="222" class="high" lang="kbr" style="list-style-type: kaffa;"><li>222</li></ol> <ol start="333" class="high" lang="kbr" style="list-style-type: kaffa;"><li>333</li></ol> <ol start="444" class="high" lang="kbr" style="list-style-type: kaffa;"><li>444</li></ol></div> </div></div> <script>addExamples('kaffa', 'kbr', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('kebena')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="kebena"><a href="#kebena">kebena</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style kebena { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1300' '\1308' '\1320' '\1328' '\1330' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_kebena" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="alw" style="list-style-type: kebena; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="alw" style="list-style-type: kebena; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="alw" style="list-style-type: kebena;"><li>11</li></ol> <ol start="22" class="high" lang="alw" style="list-style-type: kebena;"><li>22</li></ol> <ol start="33" class="high" lang="alw" style="list-style-type: kebena;"><li>33</li></ol> <ol start="44" class="high" lang="alw" style="list-style-type: kebena;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="alw" style="list-style-type: kebena;"><li>111</li></ol> <ol start="222" class="high" lang="alw" style="list-style-type: kebena;"><li>222</li></ol> <ol start="333" class="high" lang="alw" style="list-style-type: kebena;"><li>333</li></ol> <ol start="444" class="high" lang="alw" style="list-style-type: kebena;"><li>444</li></ol></div> </div></div> <script>addExamples('kebena', 'alw', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('kembata')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="kembata"><a href="#kembata">kembata</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style kembata { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1268' '\1270' '\1278' '\1290' '\1300' '\1308' '\1320' '\1328' '\1330' '\1348'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ቨ' 'ተ' 'ቸ' 'ነ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ፈ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_kembata" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ktb" style="list-style-type: kembata; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ktb" style="list-style-type: kembata; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ktb" style="list-style-type: kembata;"><li>11</li></ol> <ol start="22" class="high" lang="ktb" style="list-style-type: kembata;"><li>22</li></ol> <ol start="33" class="high" lang="ktb" style="list-style-type: kembata;"><li>33</li></ol> <ol start="44" class="high" lang="ktb" style="list-style-type: kembata;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ktb" style="list-style-type: kembata;"><li>111</li></ol> <ol start="222" class="high" lang="ktb" style="list-style-type: kembata;"><li>222</li></ol> <ol start="333" class="high" lang="ktb" style="list-style-type: kembata;"><li>333</li></ol> <ol start="444" class="high" lang="ktb" style="list-style-type: kembata;"><li>444</li></ol></div> </div></div> <script>addExamples('kembata', 'ktb', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('konso')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="konso"><a href="#konso">konso</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style konso { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\1300' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'ጀ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_konso" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="kxc" style="list-style-type: konso; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="kxc" style="list-style-type: konso; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="kxc" style="list-style-type: konso;"><li>11</li></ol> <ol start="22" class="high" lang="kxc" style="list-style-type: konso;"><li>22</li></ol> <ol start="33" class="high" lang="kxc" style="list-style-type: konso;"><li>33</li></ol> <ol start="44" class="high" lang="kxc" style="list-style-type: konso;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="kxc" style="list-style-type: konso;"><li>111</li></ol> <ol start="222" class="high" lang="kxc" style="list-style-type: konso;"><li>222</li></ol> <ol start="333" class="high" lang="kxc" style="list-style-type: konso;"><li>333</li></ol> <ol start="444" class="high" lang="kxc" style="list-style-type: konso;"><li>444</li></ol></div> </div></div> <script>addExamples('konso', 'kxc', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('kunama')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="kunama"><a href="#kunama">kunama</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style kunama { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1260' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'በ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'ጀ' 'ገ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_kunama" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="kun" style="list-style-type: kunama; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="kun" style="list-style-type: kunama; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="kun" style="list-style-type: kunama;"><li>11</li></ol> <ol start="22" class="high" lang="kun" style="list-style-type: kunama;"><li>22</li></ol> <ol start="33" class="high" lang="kun" style="list-style-type: kunama;"><li>33</li></ol> <ol start="44" class="high" lang="kun" style="list-style-type: kunama;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="kun" style="list-style-type: kunama;"><li>111</li></ol> <ol start="222" class="high" lang="kun" style="list-style-type: kunama;"><li>222</li></ol> <ol start="333" class="high" lang="kun" style="list-style-type: kunama;"><li>333</li></ol> <ol start="444" class="high" lang="kun" style="list-style-type: kunama;"><li>444</li></ol></div> </div></div> <script>addExamples('kunama', 'kun', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('meen')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="meen"><a href="#meen">meen</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style meen { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1280' '\1290' '\1298' '\1300' '\1308' '\1320' '\1328' '\1330' '\1350' '\1340'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ኀ' 'ነ' 'ኘ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ፐ' 'ፀ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_meen" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="und" style="list-style-type: meen; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="und" style="list-style-type: meen; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="und" style="list-style-type: meen;"><li>11</li></ol> <ol start="22" class="high" lang="und" style="list-style-type: meen;"><li>22</li></ol> <ol start="33" class="high" lang="und" style="list-style-type: meen;"><li>33</li></ol> <ol start="44" class="high" lang="und" style="list-style-type: meen;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="und" style="list-style-type: meen;"><li>111</li></ol> <ol start="222" class="high" lang="und" style="list-style-type: meen;"><li>222</li></ol> <ol start="333" class="high" lang="und" style="list-style-type: meen;"><li>333</li></ol> <ol start="444" class="high" lang="und" style="list-style-type: meen;"><li>444</li></ol></div> </div></div> <script>addExamples('meen', 'und', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('oromo')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="oromo"><a href="#oromo">oromo</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style oromo { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\12A0' '\12A8' '\12C8' '\12E8' '\12F0' '\12F8' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'አ' 'ከ' 'ወ' 'የ' 'ደ' 'ዸ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ጸ' 'ፈ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_oromo" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="om" style="list-style-type: oromo; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="om" style="list-style-type: oromo; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="om" style="list-style-type: oromo;"><li>11</li></ol> <ol start="22" class="high" lang="om" style="list-style-type: oromo;"><li>22</li></ol> <ol start="33" class="high" lang="om" style="list-style-type: oromo;"><li>33</li></ol> <ol start="44" class="high" lang="om" style="list-style-type: oromo;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="om" style="list-style-type: oromo;"><li>111</li></ol> <ol start="222" class="high" lang="om" style="list-style-type: oromo;"><li>222</li></ol> <ol start="333" class="high" lang="om" style="list-style-type: oromo;"><li>333</li></ol> <ol start="444" class="high" lang="om" style="list-style-type: oromo;"><li>444</li></ol></div> </div></div> <script>addExamples('oromo', 'om', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('saho')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="saho"><a href="#saho">saho</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style saho { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1240' '\1260' '\1270' '\1290' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348'; /* symbols: 'ሀ' 'ለ' 'ሐ' 'መ' 'ረ' 'ሰ' 'ቀ' 'በ' 'ተ' 'ነ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ጸ' 'ፈ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_saho" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ssy" style="list-style-type: saho; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ssy" style="list-style-type: saho; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ssy" style="list-style-type: saho;"><li>11</li></ol> <ol start="22" class="high" lang="ssy" style="list-style-type: saho;"><li>22</li></ol> <ol start="33" class="high" lang="ssy" style="list-style-type: saho;"><li>33</li></ol> <ol start="44" class="high" lang="ssy" style="list-style-type: saho;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ssy" style="list-style-type: saho;"><li>111</li></ol> <ol start="222" class="high" lang="ssy" style="list-style-type: saho;"><li>222</li></ol> <ol start="333" class="high" lang="ssy" style="list-style-type: saho;"><li>333</li></ol> <ol start="444" class="high" lang="ssy" style="list-style-type: saho;"><li>444</li></ol></div> </div></div> <script>addExamples('saho', 'ssy', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('sidama')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="sidama"><a href="#sidama">sidama</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style sidama { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\12A0' '\12A8' '\12C8' '\12E8' '\12F0' '\12F8' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'አ' 'ከ' 'ወ' 'የ' 'ደ' 'ዸ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ጸ' 'ፈ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_sidama" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="sid" style="list-style-type: sidama; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="sid" style="list-style-type: sidama; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="sid" style="list-style-type: sidama;"><li>11</li></ol> <ol start="22" class="high" lang="sid" style="list-style-type: sidama;"><li>22</li></ol> <ol start="33" class="high" lang="sid" style="list-style-type: sidama;"><li>33</li></ol> <ol start="44" class="high" lang="sid" style="list-style-type: sidama;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="sid" style="list-style-type: sidama;"><li>111</li></ol> <ol start="222" class="high" lang="sid" style="list-style-type: sidama;"><li>222</li></ol> <ol start="333" class="high" lang="sid" style="list-style-type: sidama;"><li>333</li></ol> <ol start="444" class="high" lang="sid" style="list-style-type: sidama;"><li>444</li></ol></div> </div></div> <script>addExamples('sidama', 'sid', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('silti')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="silti"><a href="#silti">silti</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style silti { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308' '\1320' '\1328' '\1330' '\1348'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ፈ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_silti" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="stv" style="list-style-type: silti; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="stv" style="list-style-type: silti; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="stv" style="list-style-type: silti;"><li>11</li></ol> <ol start="22" class="high" lang="stv" style="list-style-type: silti;"><li>22</li></ol> <ol start="33" class="high" lang="stv" style="list-style-type: silti;"><li>33</li></ol> <ol start="44" class="high" lang="stv" style="list-style-type: silti;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="stv" style="list-style-type: silti;"><li>111</li></ol> <ol start="222" class="high" lang="stv" style="list-style-type: silti;"><li>222</li></ol> <ol start="333" class="high" lang="stv" style="list-style-type: silti;"><li>333</li></ol> <ol start="444" class="high" lang="stv" style="list-style-type: silti;"><li>444</li></ol></div> </div></div> <script>addExamples('silti', 'stv', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('tigre')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="tigre"><a href="#tigre">tigre</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style tigre { system: alphabetic; symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\12A0' '\12A8' '\12C8' '\12D0' '\12D8' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'ሐ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'አ' 'ከ' 'ወ' 'ዐ' 'ዘ' 'የ' 'ደ' 'ጀ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ጸ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_tigre" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="tig" style="list-style-type: tigre; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="tig" style="list-style-type: tigre; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="tig" style="list-style-type: tigre;"><li>11</li></ol> <ol start="22" class="high" lang="tig" style="list-style-type: tigre;"><li>22</li></ol> <ol start="33" class="high" lang="tig" style="list-style-type: tigre;"><li>33</li></ol> <ol start="44" class="high" lang="tig" style="list-style-type: tigre;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="tig" style="list-style-type: tigre;"><li>111</li></ol> <ol start="222" class="high" lang="tig" style="list-style-type: tigre;"><li>222</li></ol> <ol start="333" class="high" lang="tig" style="list-style-type: tigre;"><li>333</li></ol> <ol start="444" class="high" lang="tig" style="list-style-type: tigre;"><li>444</li></ol></div> </div></div> <script>addExamples('tigre', 'tig', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('wolaita')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="wolaita"><a href="#wolaita">wolaita</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style wolaita { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1290' '\1298' '\1230' '\1308' '\1320' '\1328' '\1330' '\1338' '\1340' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'ሰ' 'ገ' 'ጠ' 'ጨ' 'ጰ' 'ጸ' 'ፀ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_wolaita" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="wal" style="list-style-type: wolaita; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="wal" style="list-style-type: wolaita; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="wal" style="list-style-type: wolaita;"><li>11</li></ol> <ol start="22" class="high" lang="wal" style="list-style-type: wolaita;"><li>22</li></ol> <ol start="33" class="high" lang="wal" style="list-style-type: wolaita;"><li>33</li></ol> <ol start="44" class="high" lang="wal" style="list-style-type: wolaita;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="wal" style="list-style-type: wolaita;"><li>111</li></ol> <ol start="222" class="high" lang="wal" style="list-style-type: wolaita;"><li>222</li></ol> <ol start="333" class="high" lang="wal" style="list-style-type: wolaita;"><li>333</li></ol> <ol start="444" class="high" lang="wal" style="list-style-type: wolaita;"><li>444</li></ol></div> </div></div> <script>addExamples('wolaita', 'wal', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('yemsa')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="yemsa"><a href="#yemsa">yemsa</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style yemsa { system: alphabetic; symbols: '\1200' '\1208' '\1218' '\1228' '\1230' '\1238' '\1240' '\1260' '\1268' '\1270' '\1278' '\1290' '\1298' '\1300' '\1308' '\1318' '\1320' '\1328' '\1330' '\1348' '\1350'; /* symbols: 'ሀ' 'ለ' 'መ' 'ረ' 'ሰ' 'ሸ' 'ቀ' 'በ' 'ቨ' 'ተ' 'ቸ' 'ነ' 'ኘ' 'ጀ' 'ገ' 'ጘ' 'ጠ' 'ጨ' 'ጰ' 'ፈ' 'ፐ'; */ suffix: '\1366 '; /* ፦ */ } </bdo></code></p> <div id="out_yemsa" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="jnj" style="list-style-type: yemsa; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="jnj" style="list-style-type: yemsa; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="jnj" style="list-style-type: yemsa;"><li>11</li></ol> <ol start="22" class="high" lang="jnj" style="list-style-type: yemsa;"><li>22</li></ol> <ol start="33" class="high" lang="jnj" style="list-style-type: yemsa;"><li>33</li></ol> <ol start="44" class="high" lang="jnj" style="list-style-type: yemsa;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="jnj" style="list-style-type: yemsa;"><li>111</li></ol> <ol start="222" class="high" lang="jnj" style="list-style-type: yemsa;"><li>222</li></ol> <ol start="333" class="high" lang="jnj" style="list-style-type: yemsa;"><li>333</li></ol> <ol start="444" class="high" lang="jnj" style="list-style-type: yemsa;"><li>444</li></ol></div> </div></div> <script>addExamples('yemsa', 'jnj', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-19"><div role="heading" class="note-title marker" id="h-note-19" aria-level="3"><span>Note</span></div><p class="">The following are built-in styles in Blink, and some in Webkit, but none work out of the box in Firefox: <code class="kw" translate="no">ethiopic-halehame</code>, <code class="kw" translate="no">ethiopic-halehame-am</code>, <code class="kw" translate="no">ethiopic-halehame-ti-er</code>, <code class="kw" translate="no">ethiopic-halehame-ti-et</code>. Use the templates provided here if you want those names to work on all browsers that support counter-styles definitions.</p></div> </section> <section id="georgian-styles"><div class="header-wrapper"><h2 id="x12-georgian"><bdi class="secno">12. </bdi>Georgian</h2><a class="self-link" href="#georgian-styles" aria-label="Permalink for Section 12."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('georgian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="georgian"><a href="#georgian">georgian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style georgian { system: additive; range: 1 19999; 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'; /* additive-symbols: 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 'ა'; */ } </bdo></code></p> <div id="out_georgian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ka" style="list-style-type: georgian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ka" style="list-style-type: georgian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ka" style="list-style-type: georgian;"><li>11</li></ol> <ol start="22" class="high" lang="ka" style="list-style-type: georgian;"><li>22</li></ol> <ol start="33" class="high" lang="ka" style="list-style-type: georgian;"><li>33</li></ol> <ol start="44" class="high" lang="ka" style="list-style-type: georgian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ka" style="list-style-type: georgian;"><li>111</li></ol> <ol start="222" class="high" lang="ka" style="list-style-type: georgian;"><li>222</li></ol> <ol start="333" class="high" lang="ka" style="list-style-type: georgian;"><li>333</li></ol> <ol start="444" class="high" lang="ka" style="list-style-type: georgian;"><li>444</li></ol></div> </div></div> <script>addExamples('georgian', 'ka', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-20"><div role="heading" class="note-title marker" id="h-note-20" aria-level="3"><span>Note</span></div><aside class=""> <p>This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">georgian</a></code> style.</p> </aside></div> </section> <section id="greek-styles"><div class="header-wrapper"><h2 id="x13-greek"><bdi class="secno">13. </bdi>Greek</h2><a class="self-link" href="#greek-styles" aria-label="Permalink for Section 13."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('greek-lower-modern')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="greek-lower-modern"><a href="#greek-lower-modern">greek-lower-modern</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style greek-lower-modern { system: additive; range: 1 999; additive-symbols: 900 \3E1, 800 \3C9, 700 \3C8, 600 \3C7, 500 \3C6, 400 \3C5, 300 \3C4, 200 \3C3, 100 \3C1, 90 \3DF, 80 \3C0, 70 \3BF, 60 \3BE, 50 \3BD, 40 \3BC, 30 \3BB, 20 \3BA, 10 \3B9, 9 \3B8, 8 \3B7, 7 \3B6, 6 \3C3\3C4, 5 \3B5, 4 \3B4, 3 \3B3, 2 \3B2, 1 \3B1; /* additive-symbols: 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 α; */ } </bdo></code></p> <div id="out_greek-lower-modern" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="el" style="list-style-type: greek-lower-modern; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="el" style="list-style-type: greek-lower-modern; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="el" style="list-style-type: greek-lower-modern;"><li>11</li></ol> <ol start="22" class="high" lang="el" style="list-style-type: greek-lower-modern;"><li>22</li></ol> <ol start="33" class="high" lang="el" style="list-style-type: greek-lower-modern;"><li>33</li></ol> <ol start="44" class="high" lang="el" style="list-style-type: greek-lower-modern;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="el" style="list-style-type: greek-lower-modern;"><li>111</li></ol> <ol start="222" class="high" lang="el" style="list-style-type: greek-lower-modern;"><li>222</li></ol> <ol start="333" class="high" lang="el" style="list-style-type: greek-lower-modern;"><li>333</li></ol> <ol start="444" class="high" lang="el" style="list-style-type: greek-lower-modern;"><li>444</li></ol></div> </div></div> <script>addExamples('greek-lower-modern', 'el', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('greek-upper-modern')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="greek-upper-modern"><a href="#greek-upper-modern">greek-upper-modern</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style greek-upper-modern { system: additive; range: 1 999; additive-symbols: 900 \3E0, 800 \3A9, 700 \3A8, 600 \3A7, 500 \3A6, 400 \3A5, 300 \3A4, 200 \3A3, 100 \3A1, 90 \3DE, 80 \3A0, 70 \39F, 60 \39E, 50 \39D, 40 \39C, 30 \39B, 20 \39A, 10 \399, 9 \398, 8 \397, 7 \396, 6 \3A3\3A4, 5 \395, 4 \394, 3 \393, 2 \392, 1 \391; /* additive-symbols: 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 Α; */ } </bdo></code></p> <div id="out_greek-upper-modern" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="el" style="list-style-type: greek-upper-modern; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="el" style="list-style-type: greek-upper-modern; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="el" style="list-style-type: greek-upper-modern;"><li>11</li></ol> <ol start="22" class="high" lang="el" style="list-style-type: greek-upper-modern;"><li>22</li></ol> <ol start="33" class="high" lang="el" style="list-style-type: greek-upper-modern;"><li>33</li></ol> <ol start="44" class="high" lang="el" style="list-style-type: greek-upper-modern;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="el" style="list-style-type: greek-upper-modern;"><li>111</li></ol> <ol start="222" class="high" lang="el" style="list-style-type: greek-upper-modern;"><li>222</li></ol> <ol start="333" class="high" lang="el" style="list-style-type: greek-upper-modern;"><li>333</li></ol> <ol start="444" class="high" lang="el" style="list-style-type: greek-upper-modern;"><li>444</li></ol></div> </div></div> <script>addExamples('greek-upper-modern', 'el', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('greek-lower-ancient')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="greek-lower-ancient"><a href="#greek-lower-ancient">greek-lower-ancient</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style greek-lower-ancient { system: additive; range: 1 999; additive-symbols: 900 \3E1, 800 \3C9, 700 \3C8, 600 \3C7, 500 \3C6, 400 \3C5, 300 \3C4, 200 \3C3, 100 \3C1, 90 \3DF, 80 \3C0, 70 \3BF, 60 \3BE, 50 \3BD, 40 \3BC, 30 \3BB, 20 \3BA, 10 \3B9, 9 \3B8, 8 \3B7, 7 \3B6, 6 \3DB, 5 \3B5, 4 \3B4, 3 \3B3, 2 \3B2, 1 \3B1; /* additive-symbols: 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 α; */ } </bdo></code></p> <div id="out_greek-lower-ancient" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="grc" style="list-style-type: greek-lower-ancient; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="grc" style="list-style-type: greek-lower-ancient; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="grc" style="list-style-type: greek-lower-ancient;"><li>11</li></ol> <ol start="22" class="high" lang="grc" style="list-style-type: greek-lower-ancient;"><li>22</li></ol> <ol start="33" class="high" lang="grc" style="list-style-type: greek-lower-ancient;"><li>33</li></ol> <ol start="44" class="high" lang="grc" style="list-style-type: greek-lower-ancient;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="grc" style="list-style-type: greek-lower-ancient;"><li>111</li></ol> <ol start="222" class="high" lang="grc" style="list-style-type: greek-lower-ancient;"><li>222</li></ol> <ol start="333" class="high" lang="grc" style="list-style-type: greek-lower-ancient;"><li>333</li></ol> <ol start="444" class="high" lang="grc" style="list-style-type: greek-lower-ancient;"><li>444</li></ol></div> </div></div> <script>addExamples('greek-lower-ancient', 'grc', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('greek-upper-ancient')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="greek-upper-ancient"><a href="#greek-upper-ancient">greek-upper-ancient</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style greek-upper-ancient { system: additive; range: 1 999; additive-symbols: 900 \3E0, 800 \3A9, 700 \3A8, 600 \3A7, 500 \3A6, 400 \3A5, 300 \3A4, 200 \3A3, 100 \3A1, 90 \3DE, 80 \3A0, 70 \39F, 60 \39E, 50 \39D, 40 \39C, 30 \39B, 20 \39A, 10 \399, 9 \398, 8 \397, 7 \396, 6 \3DA, 5 \395, 4 \394, 3 \393, 2 \392, 1 \391; /* additive-symbols: 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 Α; */ } </bdo></code></p> <div id="out_greek-upper-ancient" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="grc" style="list-style-type: greek-upper-ancient; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="grc" style="list-style-type: greek-upper-ancient; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="grc" style="list-style-type: greek-upper-ancient;"><li>11</li></ol> <ol start="22" class="high" lang="grc" style="list-style-type: greek-upper-ancient;"><li>22</li></ol> <ol start="33" class="high" lang="grc" style="list-style-type: greek-upper-ancient;"><li>33</li></ol> <ol start="44" class="high" lang="grc" style="list-style-type: greek-upper-ancient;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="grc" style="list-style-type: greek-upper-ancient;"><li>111</li></ol> <ol start="222" class="high" lang="grc" style="list-style-type: greek-upper-ancient;"><li>222</li></ol> <ol start="333" class="high" lang="grc" style="list-style-type: greek-upper-ancient;"><li>333</li></ol> <ol start="444" class="high" lang="grc" style="list-style-type: greek-upper-ancient;"><li>444</li></ol></div> </div></div> <script>addExamples('greek-upper-ancient', 'grc', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-greek')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-greek"><a href="#lower-greek">lower-greek</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-greek { system: alphabetic; 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'; /* symbols: 'α' 'β' 'γ' 'δ' 'ε' 'ζ' 'η' 'θ' 'ι' 'κ' 'λ' 'μ' 'ν' 'ξ' 'ο' 'π' 'ρ' 'σ' 'τ' 'υ' 'φ' 'χ' 'ψ' 'ω'; */ /* This style is only defined because CSS2.1 has it. It doesn't appear to actually be used in Greek texts. */ } </bdo></code></p> <div id="out_lower-greek" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="el" style="list-style-type: lower-greek; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="el" style="list-style-type: lower-greek; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="el" style="list-style-type: lower-greek;"><li>11</li></ol> <ol start="22" class="high" lang="el" style="list-style-type: lower-greek;"><li>22</li></ol> <ol start="33" class="high" lang="el" style="list-style-type: lower-greek;"><li>33</li></ol> <ol start="44" class="high" lang="el" style="list-style-type: lower-greek;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="el" style="list-style-type: lower-greek;"><li>111</li></ol> <ol start="222" class="high" lang="el" style="list-style-type: lower-greek;"><li>222</li></ol> <ol start="333" class="high" lang="el" style="list-style-type: lower-greek;"><li>333</li></ol> <ol start="444" class="high" lang="el" style="list-style-type: lower-greek;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-greek', 'el', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-21"><div role="heading" class="note-title marker" id="h-note-21" aria-level="3"><span>Note</span></div><aside class="">The <code class="kw" translate="no">lower-greek</code> style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification, however the <code class="kw" translate="no">greek-lower-modern</code> style is more commonly used in Greece. CSS2.1 included the <code class="kw" translate="no">lower-greek</code> keyword, which <a href="https://github.com/w3c/csswg-drafts/issues/135#issuecomment-248303975">it appears</a> is used in mathematical texts, rather than ordinary Greek text. At the time of writing, all major browsers support the <code class="kw" translate="no">lower-greek</code> counter style but not the <code class="kw" translate="no">greek-lower-modern</code> style. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplealphabetic" target="_blank">lower-greek</a></code> style.</aside></div> </section> <section id="gujarati-styles"><div class="header-wrapper"><h2 id="x14-gujarati"><bdi class="secno">14. </bdi>Gujarati</h2><a class="self-link" href="#gujarati-styles" aria-label="Permalink for Section 14."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('gujarati')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="gujarati"><a href="#gujarati">gujarati</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style gujarati { system: numeric; symbols: '\AE6' '\AE7' '\AE8' '\AE9' '\AEA' '\AEB' '\AEC' '\AED' '\AEE' '\AEF'; /* symbols: '૦' '૧' '૨' '૩' '૪' '૫' '૬' '૭' '૮' '૯'; */ } </bdo></code></p> <div id="out_gujarati" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="gu" style="list-style-type: gujarati; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="gu" style="list-style-type: gujarati; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="gu" style="list-style-type: gujarati;"><li>11</li></ol> <ol start="22" class="high" lang="gu" style="list-style-type: gujarati;"><li>22</li></ol> <ol start="33" class="high" lang="gu" style="list-style-type: gujarati;"><li>33</li></ol> <ol start="44" class="high" lang="gu" style="list-style-type: gujarati;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="gu" style="list-style-type: gujarati;"><li>111</li></ol> <ol start="222" class="high" lang="gu" style="list-style-type: gujarati;"><li>222</li></ol> <ol start="333" class="high" lang="gu" style="list-style-type: gujarati;"><li>333</li></ol> <ol start="444" class="high" lang="gu" style="list-style-type: gujarati;"><li>444</li></ol></div> </div></div> <script>addExamples('gujarati', 'gu', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-22"><div role="heading" class="note-title marker" id="h-note-22" aria-level="3"><span>Note</span></div><aside class="">This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">gujarati</a></code> style.</aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('gujarati-alpha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="gujarati-alpha"><a href="#gujarati-alpha">gujarati-alpha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style gujarati-alpha { system: alphabetic; symbols: '\0A95' '\0A96' '\0A97' '\0A98' '\0A99' '\0A9A' '\0A9B' '\0A9C' '\0A9D' '\0A9E' '\0A9F' '\0AA0' '\0AA1' '\0AA2' '\0AA3' '\0AA4' '\0AA5' '\0AA6' '\0AA7' '\0AA8' '\0AAA' '\0AAB' '\0AAC' '\0AAD' '\0AAE' '\0AAF' '\0AB0' '\0AB2' '\0AB5' '\0AB6' '\0AB7' '\0AB8' '\0AB9' '\0AB3'; /* symbols: 'ક' 'ખ' 'ગ' 'ઘ' 'ઙ' 'ચ' 'છ' 'જ' 'ઝ' 'ઞ' 'ટ' 'ઠ' 'ડ' 'ઢ' 'ણ' 'ત' 'થ' 'દ' 'ધ' 'ન' 'પ' 'ફ' 'બ' 'ભ' 'મ' 'ય' 'ર' 'લ' 'વ' 'શ' 'ષ' 'સ' 'હ' 'ળ' ; */ prefix: '( '; suffix: ' ) '; } </bdo></code></p> <div id="out_gujarati-alpha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="gu" style="list-style-type: gujarati-alpha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="gu" style="list-style-type: gujarati-alpha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="gu" style="list-style-type: gujarati-alpha;"><li>11</li></ol> <ol start="22" class="high" lang="gu" style="list-style-type: gujarati-alpha;"><li>22</li></ol> <ol start="33" class="high" lang="gu" style="list-style-type: gujarati-alpha;"><li>33</li></ol> <ol start="44" class="high" lang="gu" style="list-style-type: gujarati-alpha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="gu" style="list-style-type: gujarati-alpha;"><li>111</li></ol> <ol start="222" class="high" lang="gu" style="list-style-type: gujarati-alpha;"><li>222</li></ol> <ol start="333" class="high" lang="gu" style="list-style-type: gujarati-alpha;"><li>333</li></ol> <ol start="444" class="high" lang="gu" style="list-style-type: gujarati-alpha;"><li>444</li></ol></div> </div></div> <script>addExamples('gujarati-alpha', 'gu', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-23"><div role="heading" class="note-title marker" id="h-note-23" aria-level="3"><span>Note</span></div><aside class=""> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style gujarati-alpha-paren { system: extends gujarati-alpha; prefix: ''; suffix: ") "; } </bdo></code></li> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style gujarati-alpha-period { system: extends gujarati-alpha; prefix: ''; suffix: ". "; } </bdo></code></li> </ol> </aside></div> </section> <section id="gurmukhi-styles"><div class="header-wrapper"><h2 id="x15-gurmukhi"><bdi class="secno">15. </bdi>Gurmukhi</h2><a class="self-link" href="#gurmukhi-styles" aria-label="Permalink for Section 15."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('gurmukhi')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="gurmukhi"><a href="#gurmukhi">gurmukhi</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style gurmukhi { system: numeric; symbols: '\A66' '\A67' '\A68' '\A69' '\A6A' '\A6B' '\A6C' '\A6D' '\A6E' '\A6F'; /* symbols: '੦' '੧' '੨' '੩' '੪' '੫' '੬' '੭' '੮' '੯'; */ } </bdo></code></p> <div id="out_gurmukhi" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="pa" style="list-style-type: gurmukhi; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="pa" style="list-style-type: gurmukhi; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="pa" style="list-style-type: gurmukhi;"><li>11</li></ol> <ol start="22" class="high" lang="pa" style="list-style-type: gurmukhi;"><li>22</li></ol> <ol start="33" class="high" lang="pa" style="list-style-type: gurmukhi;"><li>33</li></ol> <ol start="44" class="high" lang="pa" style="list-style-type: gurmukhi;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="pa" style="list-style-type: gurmukhi;"><li>111</li></ol> <ol start="222" class="high" lang="pa" style="list-style-type: gurmukhi;"><li>222</li></ol> <ol start="333" class="high" lang="pa" style="list-style-type: gurmukhi;"><li>333</li></ol> <ol start="444" class="high" lang="pa" style="list-style-type: gurmukhi;"><li>444</li></ol></div> </div></div> <script>addExamples('gurmukhi', 'pa', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-24"><div role="heading" class="note-title marker" id="h-note-24" aria-level="3"><span>Note</span></div><p class="">This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">gurmukhi</a></code> style.</p></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('punjabi')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name"><a href="#punjabi">punjabi</a></p> <p class="counterstyle" id="punjabi"><code><bdo dir="ltr"> @counter-style punjabi { system: alphabetic; symbols: '\0A73' '\0A05' '\0A72' '\0A38' '\0A39' '\0A15' '\0A16' '\0A17' '\0A18' '\0A19' '\0A1A' '\0A1B' '\0A1C' '\0A1D' '\0A1E' '\0A1F' '\0A20' '\0A21 ' '\0A22' '\0A23' '\0A24' '\0A25' '\0A26' '\0A27' '\0A28' '\0A2A' '\0A2B ' '\0A2C' '\0A2D' '\0A2E' '\0A2F' '\0A30' '\0A32' '\0A35' '\0A5C' ; /* symbols: 'ੳ' 'ਅ' 'ੲ' 'ਸ' 'ਹ' 'ਕ' 'ਖ' 'ਗ' 'ਘ' 'ਙ' 'ਚ' 'ਛ' 'ਜ' 'ਝ' 'ਞ' 'ਟ' 'ਠ' 'ਡ' 'ਢ' 'ਣ' 'ਤ' 'ਥ' 'ਦ' 'ਧ' 'ਨ' 'ਪ' 'ਫ' 'ਬ' 'ਭ' 'ਮ' 'ਯ' 'ਰ' 'ਲ' 'ਵ' 'ੜ' ; */ suffix: ') '; } </bdo></code></p> <div id="out_punjabi" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="pa" style="list-style-type: punjabi; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="pa" style="list-style-type: punjabi; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="pa" style="list-style-type: punjabi;"><li>11</li></ol> <ol start="22" class="high" lang="pa" style="list-style-type: punjabi;"><li>22</li></ol> <ol start="33" class="high" lang="pa" style="list-style-type: punjabi;"><li>33</li></ol> <ol start="44" class="high" lang="pa" style="list-style-type: punjabi;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="pa" style="list-style-type: punjabi;"><li>111</li></ol> <ol start="222" class="high" lang="pa" style="list-style-type: punjabi;"><li>222</li></ol> <ol start="333" class="high" lang="pa" style="list-style-type: punjabi;"><li>333</li></ol> <ol start="444" class="high" lang="pa" style="list-style-type: punjabi;"><li>444</li></ol></div> </div></div> <script>addExamples('punjabi', 'pa', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-25"><div role="heading" class="note-title marker" id="h-note-25" aria-level="3"><span>Note</span></div><aside class=""> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style punjabi-dbl-paren { system: extends punjabi; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> </section> <section id="rohingya-styles"><div class="header-wrapper"><h2 id="x16-hanifi-rohingya"><bdi class="secno">16. </bdi>Hanifi Rohingya</h2><a class="self-link" href="#rohingya-styles" aria-label="Permalink for Section 16."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('hanifi-rohingya')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="hanifi-rohingya"><a href="#hanifi-rohingya">hanifi-rohingya</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style hanifi-rohingya { system: numeric; symbols: '\10D30' '\10D31' '\10D32' '\10D33' '\10D34' '\10D35' '\10D36' '\10D37' '\10D38' '\10D39'; /* symbols: '𐴰' '𐴱' '𐴲' '𐴳' '𐴴' '𐴵' '𐴶' '𐴷' '𐴸' '𐴹'; */ } </bdo></code></p> <div id="out_hanifi-rohingya" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="rhg" style="list-style-type: hanifi-rohingya; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="rhg" style="list-style-type: hanifi-rohingya; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="rhg" style="list-style-type: hanifi-rohingya;"><li>11</li></ol> <ol start="22" class="high" lang="rhg" style="list-style-type: hanifi-rohingya;"><li>22</li></ol> <ol start="33" class="high" lang="rhg" style="list-style-type: hanifi-rohingya;"><li>33</li></ol> <ol start="44" class="high" lang="rhg" style="list-style-type: hanifi-rohingya;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="rhg" style="list-style-type: hanifi-rohingya;"><li>111</li></ol> <ol start="222" class="high" lang="rhg" style="list-style-type: hanifi-rohingya;"><li>222</li></ol> <ol start="333" class="high" lang="rhg" style="list-style-type: hanifi-rohingya;"><li>333</li></ol> <ol start="444" class="high" lang="rhg" style="list-style-type: hanifi-rohingya;"><li>444</li></ol></div> </div></div> <script>addExamples('hanifi-rohingya', 'rhg', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-26"><div role="heading" class="note-title marker" id="h-note-26" aria-level="3"><span>Note</span></div><aside class=""> <p>The style as described here uses a period+space (by default) as a suffix. Further investigation needs to be conducted to determine whether other affixes are common.</p> </aside></div> </section> <section id="hebrew-styles"><div class="header-wrapper"><h2 id="x17-hebrew"><bdi class="secno">17. </bdi>Hebrew</h2><a class="self-link" href="#hebrew-styles" aria-label="Permalink for Section 17."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('hebrew')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="hebrew"><a href="#hebrew">hebrew</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style hebrew { system: additive; range: 1 10999; additive-symbols: 10000 \5D9\5F3, 9000 \5D8\5F3, 8000 \5D7\5F3, 7000 \5D6\5F3, 6000 \5D5\5F3, 5000 \5D4\5F3, 4000 \5D3\5F3, 3000 \5D2\5F3, 2000 \5D1\5F3, 1000 \5D0\5F3, 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; /* additive-symbols: 10000 י׳, 9000 ט׳, 8000 ח׳, 7000 ז׳, 6000 ו׳, 5000 ה׳, 4000 ד׳, 3000 ג׳, 2000 ב׳, 1000 א׳, 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 א; */ } </bdo></code></p> <div id="out_hebrew" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="he" style="list-style-type: hebrew; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="he" style="list-style-type: hebrew; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="he" style="list-style-type: hebrew;"><li>11</li></ol> <ol start="22" class="high" lang="he" style="list-style-type: hebrew;"><li>22</li></ol> <ol start="33" class="high" lang="he" style="list-style-type: hebrew;"><li>33</li></ol> <ol start="44" class="high" lang="he" style="list-style-type: hebrew;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="he" style="list-style-type: hebrew;"><li>111</li></ol> <ol start="222" class="high" lang="he" style="list-style-type: hebrew;"><li>222</li></ol> <ol start="333" class="high" lang="he" style="list-style-type: hebrew;"><li>333</li></ol> <ol start="444" class="high" lang="he" style="list-style-type: hebrew;"><li>444</li></ol></div> </div></div> <script>addExamples('hebrew', 'he', 'rtl')</script> </div> <div class="note" role="note" id="issue-container-generatedID-27"><div role="heading" class="note-title marker" id="h-note-27" aria-level="3"><span>Note</span></div><p class="">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. Predefined implementations may, and some do, choose to implement this manually to a higher range. (Users can define it how they like, of course.)</p></div> <div class="note" role="note" id="issue-container-generatedID-28"><div role="heading" class="note-title marker" id="h-note-28" aria-level="3"><span>Note</span></div><p class="">This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">hebrew</a></code> style.</p></div> </section> <section id="chinese-styles"><div class="header-wrapper"><h2 id="x18-han-cjk"><bdi class="secno">18. </bdi>Han & <abbr title="Chinese/Japanese/Korean">CJK</abbr></h2><a class="self-link" href="#chinese-styles" aria-label="Permalink for Section 18."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('cjk-decimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="cjk-decimal"><a href="#cjk-decimal">cjk-decimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style cjk-decimal { system: numeric; range: 0 infinite; symbols: '\3007' '\4E00' '\4E8C' '\4E09' '\56DB' '\4E94' '\516D' '\4E03' '\516B' '\4E5D'; /* symbols: 〇一二三四五六七八九; */ suffix: '\3001'; /* suffix: "、" */ } </bdo></code></p> <div id="out_cjk-decimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: cjk-decimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: cjk-decimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: cjk-decimal;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: cjk-decimal;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: cjk-decimal;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: cjk-decimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: cjk-decimal;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: cjk-decimal;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: cjk-decimal;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: cjk-decimal;"><li>444</li></ol></div> </div></div> <script>addExamples('cjk-decimal', 'zh', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('cjk-earthly-branch')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="cjk-earthly-branch"><a href="#cjk-earthly-branch">cjk-earthly-branch</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style cjk-earthly-branch { system: fixed; symbols: '\5B50' '\4E11' '\5BC5' '\536F' '\8FB0' '\5DF3' '\5348' '\672A' '\7533' '\9149' '\620C' '\4EA5'; suffix: '\3001'; fallback: cjk-decimal; /* symbols: '子' '丑' '寅' '卯' '辰' '巳' '午' '未' '申' '酉' '戌' '亥'; */ /* suffix: '、'; */ } </bdo></code></p> <div id="out_cjk-earthly-branch" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: cjk-earthly-branch; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: cjk-earthly-branch; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: cjk-earthly-branch;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: cjk-earthly-branch;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: cjk-earthly-branch;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: cjk-earthly-branch;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: cjk-earthly-branch;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: cjk-earthly-branch;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: cjk-earthly-branch;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: cjk-earthly-branch;"><li>444</li></ol></div> </div></div> <script>addExamples('cjk-earthly-branch', 'zh', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('cjk-heavenly-stem')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="cjk-heavenly-stem"><a href="#cjk-heavenly-stem">cjk-heavenly-stem</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style cjk-heavenly-stem { system: fixed; symbols: '\7532' '\4E59' '\4E19' '\4E01' '\620A' '\5DF1' '\5E9A' '\8F9B' '\58EC' '\7678'; suffix: '\3001'; fallback: cjk-decimal; /* symbols: '甲' '乙' '丙' '丁' '戊' '己' '庚' '辛' '壬' '癸'; */ /* suffix: '、'; */ } </bdo></code></p> <div id="out_cjk-heavenly-stem" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: cjk-heavenly-stem; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: cjk-heavenly-stem; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: cjk-heavenly-stem;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: cjk-heavenly-stem;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: cjk-heavenly-stem;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: cjk-heavenly-stem;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: cjk-heavenly-stem;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: cjk-heavenly-stem;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: cjk-heavenly-stem;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: cjk-heavenly-stem;"><li>444</li></ol></div> </div></div> <script>addExamples('cjk-heavenly-stem', 'zh', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('circled-ideograph')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="circled-ideograph"><a href="#circled-ideograph">circled-ideograph</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style circled-ideograph { system: fixed; symbols: '\3280' '\3281' '\3282' '\3283' '\3284' '\3285' '\3286' '\3287' '\3288' '\3289'; /* symbols: '㊀' '㊁' '㊂' '㊃' '㊄' '㊅' '㊆' '㊇' '㊈' '㊉'; */ suffix: ' '; } </bdo></code></p> <div id="out_circled-ideograph" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: circled-ideograph; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: circled-ideograph; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: circled-ideograph;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: circled-ideograph;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: circled-ideograph;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: circled-ideograph;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: circled-ideograph;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: circled-ideograph;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: circled-ideograph;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: circled-ideograph;"><li>444</li></ol></div> </div></div> <script>addExamples('circled-ideograph', 'zh', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('parenthesized-ideograph')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="parenthesized-ideograph"><a href="#parenthesized-ideograph">parenthesized-ideograph</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style parenthesized-ideograph { system: fixed; symbols: '\3220' '\3221' '\3222' '\3223' '\3224' '\3225' '\3226' '\3227' '\3228' '\3229'; /* symbols: '㈠' '㈡' '㈢' '㈣' '㈤' '㈥' '㈦' '㈧' '㈨' '㈩'; */ suffix: ' '; } </bdo></code></p> <div id="out_parenthesized-ideograph" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: parenthesized-ideograph; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: parenthesized-ideograph; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: parenthesized-ideograph;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: parenthesized-ideograph;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: parenthesized-ideograph;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: parenthesized-ideograph;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: parenthesized-ideograph;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: parenthesized-ideograph;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: parenthesized-ideograph;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: parenthesized-ideograph;"><li>444</li></ol></div> </div></div> <script>addExamples('parenthesized-ideograph', 'zh', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('cjk-tally-mark')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="cjk-tally-mark"><a href="#cjk-tally-mark">cjk-tally-mark</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style cjk-tally-mark { system: additive; additive-symbols: 5 '\1D376', 4 '\1D375', 3 '\1D374', 2 '\1D373', 1 '\1D372'; /* symbols: 5 𝍶, 4 𝍵, 3 𝍴, 2 𝍳, 1 𝍲; */ suffix: ' '; } </bdo></code></p> <div id="out_cjk-tally-mark" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: cjk-tally-mark; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: cjk-tally-mark; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: cjk-tally-mark;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: cjk-tally-mark;"><li>22</li></ol></div></div> </div> <script>addExamples('cjk-tally-mark', 'zh', '', 'vshort')</script> </div> <div class="note" role="note" id="issue-container-generatedID-29"><div role="heading" class="note-title marker" id="h-note-29" aria-level="3"><span>Note</span></div><aside class=""> <p>These symbols were introduced in Unicode 11, so not many fonts are likely to support them. One font that does is Symbola.</p> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('cjk-stem-branch')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="cjk-stem-branch"><a href="#cjk-stem-branch">cjk-stem-branch</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style cjk-stem-branch { system: cyclic; symbols: '\7532\5B50' '\4E59\4E11' '\4E19\5BC5' '\4E01\536F' '\620A\8FB0' '\5DF1\5DF3' '\5E9A\5348' '\8F9B\672A' '\58EC\7533' '\7678\9149' '\7532\620C' '\4E59\4EA5' '\4E19\5B50' '\4E01\4E11' '\620A\5BC5' '\5DF1\536F' '\5E9A\8FB0' '\8F9B\5DF3' '\58EC\5348' '\7678\672A' '\7532\7533' '\4E59\9149' '\4E19\620C' '\4E01\4EA5' '\620A\5B50' '\5DF1\4E11' '\5E9A\5BC5' '\8F9B\536F' '\58EC\8FB0' '\7678\5DF3' '\7532\5348' '\4E59\672A' '\4E19\7533' '\4E01\9149' '\620A\620C' '\5DF1\4EA5' '\5E9A\5B50' '\8F9B\4E11' '\58EC\5BC5' '\7678\536F' '\7532\8FB0' '\4E59\5DF3' '\4E19\5348' '\4E01\672A' '\620A\7533' '\5DF1\9149' '\5E9A\620C' '\8F9B\4EA5' '\58EC\5B50' '\7678\4E11' '\7532\5BC5' '\4E59\536F' '\4E19\8FB0' '\4E01\5DF3' '\620A\5348' '\5DF1\672A' '\5E9A\7533' '\8F9B\9149' '\58EC\620C' '\7678\4EA5'; /* 甲子乙丑丙寅丁卯戊辰己巳庚午辛未壬申癸酉 */ /* 甲戌乙亥丙子丁丑戊寅己卯庚辰辛巳壬午癸未 */ /* 甲申乙酉丙戌丁亥戊子己丑庚寅辛卯壬辰癸巳 */ /* 甲午乙未丙申丁酉戊戌己亥庚子辛丑壬寅癸卯 */ /* 甲辰乙巳丙午丁未戊申己酉庚戌辛亥壬子癸丑 */ /* 甲寅乙卯丙辰丁巳戊午己未庚申辛酉壬戌癸亥 */ suffix: '、'; } </bdo></code></p> <div id="out_cjk-stem-branch" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: cjk-stem-branch; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: cjk-stem-branch; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: cjk-stem-branch;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: cjk-stem-branch;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: cjk-stem-branch;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: cjk-stem-branch;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: cjk-stem-branch;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: cjk-stem-branch;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: cjk-stem-branch;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: cjk-stem-branch;"><li>444</li></ol></div> </div></div> <script>addExamples('cjk-stem-branch', 'zh', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-30"><div role="heading" class="note-title marker" id="h-note-30" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">cjk-decimal</code>, <code class="kw" translate="no">cjk-earthly-branch</code>, and <code class="kw" translate="no">cjk-heavenly-stem</code> styles are defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">cjk-decimal</a></code>, <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplefixed" target="_blank">cjk-earthly-branch</a></code>, and <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplefixed" target="_blank">cjk-heavenly-stem</a></code> styles.</p> </aside></div> <div class="note" role="note" id="issue-container-generatedID-31"><div role="heading" class="note-title marker" id="h-note-31" aria-level="3"><span>Note</span></div><aside class=""> <p>Also, see the<code> </code>specification for the following more complex predefined Chinese styles: <code class="kw" translate="no">simp-chinese-informal</code>, <code class="kw" translate="no">simp-chinese-formal</code>, <code class="kw" translate="no">trad-chinese-informal</code>, <code class="kw" translate="no">trad-chinese-formal</code>, which are not defined here. Check browser support for <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#chinese" target="_blank">simp-chinese-informal</a></code>, <code><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#chinese" target="_blank">simp-chinese-formal</a></code>, <code><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#chinese" target="_blank">trad-chinese-informal</a></code>, and <code><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#chinese" target="_blank">trad-chinese-formal</a></code> styles.</p> </aside></div> <div class="csWrapper"> <p class="name" id="simp-chinese-informal"><a href="#simp-chinese-informal">simp-chinese-informal</a></p> <div id="out_simp-chinese-informal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: simp-chinese-informal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: simp-chinese-informal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: simp-chinese-informal;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: simp-chinese-informal;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: simp-chinese-informal;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: simp-chinese-informal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: simp-chinese-informal;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: simp-chinese-informal;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: simp-chinese-informal;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: simp-chinese-informal;"><li>444</li></ol></div> </div></div> <script>addExamples('simp-chinese-informal', 'zh', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-32"><div role="heading" class="note-title marker" id="h-note-32" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">simp-chinese-informal</code> style follows special rules that are described in the <a href="https://www.w3.org/TR/css-counter-styles-3/#limited-chinese" target="_blank">Counter Styles specification</a>.</p> </aside></div> <div class="csWrapper"> <p class="name" id="simp-chinese-formal"><a href="#simp-chinese-formal">simp-chinese-formal</a></p> <div id="out_simp-chinese-formal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: simp-chinese-formal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: simp-chinese-formal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: simp-chinese-formal;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: simp-chinese-formal;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: simp-chinese-formal;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: simp-chinese-formal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: simp-chinese-formal;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: simp-chinese-formal;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: simp-chinese-formal;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: simp-chinese-formal;"><li>444</li></ol></div> </div></div> <script>addExamples('simp-chinese-formal', 'zh', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-33"><div role="heading" class="note-title marker" id="h-note-33" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">simp-chinese-formal</code> style follows special rules that are described in the <a href="https://www.w3.org/TR/css-counter-styles-3/#limited-chinese" target="_blank">Counter Styles specification</a>.</p> </aside></div> <div class="csWrapper"> <p class="name" id="trad-chinese-informal"><a href="#trad-chinese-informal">trad-chinese-informal</a></p> <div id="out_trad-chinese-informal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: trad-chinese-informal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: trad-chinese-informal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: trad-chinese-informal;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: trad-chinese-informal;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: trad-chinese-informal;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: trad-chinese-informal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: trad-chinese-informal;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: trad-chinese-informal;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: trad-chinese-informal;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: trad-chinese-informal;"><li>444</li></ol></div> </div></div> <script>addExamples('trad-chinese-informal', 'zh', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-34"><div role="heading" class="note-title marker" id="h-note-34" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">trad-chinese-informal</code> style follows special rules that are described in the <a href="https://www.w3.org/TR/css-counter-styles-3/#limited-chinese" target="_blank">Counter Styles specification</a>.</p> </aside></div> <div class="csWrapper"> <p class="name" id="trad-chinese-formal"><a href="#trad-chinese-formal">trad-chinese-formal</a></p> <div id="out_trad-chinese-formal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="zh" style="list-style-type: trad-chinese-formal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="zh" style="list-style-type: trad-chinese-formal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="zh" style="list-style-type: trad-chinese-formal;"><li>11</li></ol> <ol start="22" class="high" lang="zh" style="list-style-type: trad-chinese-formal;"><li>22</li></ol> <ol start="33" class="high" lang="zh" style="list-style-type: trad-chinese-formal;"><li>33</li></ol> <ol start="44" class="high" lang="zh" style="list-style-type: trad-chinese-formal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="zh" style="list-style-type: trad-chinese-formal;"><li>111</li></ol> <ol start="222" class="high" lang="zh" style="list-style-type: trad-chinese-formal;"><li>222</li></ol> <ol start="333" class="high" lang="zh" style="list-style-type: trad-chinese-formal;"><li>333</li></ol> <ol start="444" class="high" lang="zh" style="list-style-type: trad-chinese-formal;"><li>444</li></ol></div> </div></div> <script>addExamples('trad-chinese-formal', 'zh', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-35"><div role="heading" class="note-title marker" id="h-note-35" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">trad-chinese-formal</code> style follows special rules that are described in the <a href="https://www.w3.org/TR/css-counter-styles-3/#limited-chinese" target="_blank">Counter Styles specification</a>.</p> </aside></div> </section> <section id="kana-styles"><div class="header-wrapper"><h2 id="x19-japanese"><bdi class="secno">19. </bdi>Japanese</h2><a class="self-link" href="#kana-styles" aria-label="Permalink for Section 19."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('hiragana')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="hiragana"><a href="#hiragana">hiragana</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style hiragana { system: alphabetic; 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' '\3090' '\3091' '\3092' '\3093'; /* symbols: あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわゐゑをん; */ suffix: '、'; } </bdo></code></p> <div id="out_hiragana" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ja" style="list-style-type: hiragana; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ja" style="list-style-type: hiragana; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ja" style="list-style-type: hiragana;"><li>11</li></ol> <ol start="22" class="high" lang="ja" style="list-style-type: hiragana;"><li>22</li></ol> <ol start="33" class="high" lang="ja" style="list-style-type: hiragana;"><li>33</li></ol> <ol start="44" class="high" lang="ja" style="list-style-type: hiragana;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ja" style="list-style-type: hiragana;"><li>111</li></ol> <ol start="222" class="high" lang="ja" style="list-style-type: hiragana;"><li>222</li></ol> <ol start="333" class="high" lang="ja" style="list-style-type: hiragana;"><li>333</li></ol> <ol start="444" class="high" lang="ja" style="list-style-type: hiragana;"><li>444</li></ol></div> </div></div> <script>addExamples('hiragana', 'ja', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('hiragana-iroha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="hiragana-iroha"><a href="#hiragana-iroha">hiragana-iroha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style hiragana-iroha { system: alphabetic; 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'; /* symbols: いろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせす; */ suffix: '、'; } </bdo></code></p> <div id="out_hiragana-iroha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ja" style="list-style-type: hiragana-iroha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ja" style="list-style-type: hiragana-iroha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ja" style="list-style-type: hiragana-iroha;"><li>11</li></ol> <ol start="22" class="high" lang="ja" style="list-style-type: hiragana-iroha;"><li>22</li></ol> <ol start="33" class="high" lang="ja" style="list-style-type: hiragana-iroha;"><li>33</li></ol> <ol start="44" class="high" lang="ja" style="list-style-type: hiragana-iroha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ja" style="list-style-type: hiragana-iroha;"><li>111</li></ol> <ol start="222" class="high" lang="ja" style="list-style-type: hiragana-iroha;"><li>222</li></ol> <ol start="333" class="high" lang="ja" style="list-style-type: hiragana-iroha;"><li>333</li></ol> <ol start="444" class="high" lang="ja" style="list-style-type: hiragana-iroha;"><li>444</li></ol></div> </div></div> <script>addExamples('hiragana-iroha', 'ja', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('katakana')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="katakana"><a href="#katakana">katakana</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style katakana { system: alphabetic; 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' '\30F0' '\30F1' '\30F2' '\30F3'; /* symbols: アイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワヰヱヲン; */ suffix: '、'; } </bdo></code></p> <div id="out_katakana" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ja" style="list-style-type: katakana; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ja" style="list-style-type: katakana; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ja" style="list-style-type: katakana;"><li>11</li></ol> <ol start="22" class="high" lang="ja" style="list-style-type: katakana;"><li>22</li></ol> <ol start="33" class="high" lang="ja" style="list-style-type: katakana;"><li>33</li></ol> <ol start="44" class="high" lang="ja" style="list-style-type: katakana;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ja" style="list-style-type: katakana;"><li>111</li></ol> <ol start="222" class="high" lang="ja" style="list-style-type: katakana;"><li>222</li></ol> <ol start="333" class="high" lang="ja" style="list-style-type: katakana;"><li>333</li></ol> <ol start="444" class="high" lang="ja" style="list-style-type: katakana;"><li>444</li></ol></div> </div></div> <script>addExamples('katakana', 'ja', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('katakana-iroha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="katakana-iroha"><a href="#katakana-iroha">katakana-iroha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style katakana-iroha { system: alphabetic; 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'; /* symbols: イロハニホヘトチリヌルヲワカヨタレソツネナラムウヰノオクヤマケフコエテアサキユメミシヱヒモセス; */ suffix: '、'; } </bdo></code></p> <div id="out_katakana-iroha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ja" style="list-style-type: katakana-iroha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ja" style="list-style-type: katakana-iroha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ja" style="list-style-type: katakana-iroha;"><li>11</li></ol> <ol start="22" class="high" lang="ja" style="list-style-type: katakana-iroha;"><li>22</li></ol> <ol start="33" class="high" lang="ja" style="list-style-type: katakana-iroha;"><li>33</li></ol> <ol start="44" class="high" lang="ja" style="list-style-type: katakana-iroha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ja" style="list-style-type: katakana-iroha;"><li>111</li></ol> <ol start="222" class="high" lang="ja" style="list-style-type: katakana-iroha;"><li>222</li></ol> <ol start="333" class="high" lang="ja" style="list-style-type: katakana-iroha;"><li>333</li></ol> <ol start="444" class="high" lang="ja" style="list-style-type: katakana-iroha;"><li>444</li></ol></div> </div></div> <script>addExamples('katakana-iroha', 'ja', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('circled-katakana')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="circled-katakana"><a href="#circled-katakana">circled-katakana</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style circled-katakana { system: fixed; symbols: '\32D0' '\32D1' '\32D2' '\32D3' '\32D4' '\32D5' '\32D6' '\32D7' '\32D8' '\32D9' '\32DA' '\32DB' '\32DC' '\32DD' '\32DE' '\32DF' '\32E0' '\32E1' '\32E2' '\32E3' '\32E4' '\32E5' '\32E6' '\32E7' '\32E8' '\32E9' '\32EA' '\32EB' '\32EC' '\32ED' '\32EE' '\32EF' '\32F0' '\32F1' '\32F2' '\32F3' '\32F4' '\32F5' '\32F6' '\32F7' '\32F8' '\32F9' '\32FA' '\32FB' '\32FC' '\32FD' '\32FE'; /* symbols: ㋐㋑㋒㋓㋔㋕㋖㋗㋘㋙㋚㋛㋜㋝㋞㋟㋠㋡㋢㋣㋤㋥㋦㋧㋨㋩㋪㋫㋬㋭㋮㋯㋰㋱㋲㋳㋴㋵㋶㋷㋸㋹㋺㋻㋼㋽㋾; */ suffix: ' '; } </bdo></code></p> <div id="out_circled-katakana" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ja" style="list-style-type: circled-katakana; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ja" style="list-style-type: circled-katakana; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ja" style="list-style-type: circled-katakana;"><li>11</li></ol> <ol start="22" class="high" lang="ja" style="list-style-type: circled-katakana;"><li>22</li></ol> <ol start="33" class="high" lang="ja" style="list-style-type: circled-katakana;"><li>33</li></ol> <ol start="44" class="high" lang="ja" style="list-style-type: circled-katakana;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ja" style="list-style-type: circled-katakana;"><li>111</li></ol> <ol start="222" class="high" lang="ja" style="list-style-type: circled-katakana;"><li>222</li></ol> <ol start="333" class="high" lang="ja" style="list-style-type: circled-katakana;"><li>333</li></ol> <ol start="444" class="high" lang="ja" style="list-style-type: circled-katakana;"><li>444</li></ol></div> </div></div> <script>addExamples('circled-katakana', 'ja', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('japanese-informal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="japanese-informal"><a href="#japanese-informal">japanese-informal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style japanese-informal { system: additive; range: -9999 9999; additive-symbols: 9000 \4E5D\5343, 8000 \516B\5343, 7000 \4E03\5343, 6000 \516D\5343, 5000 \4E94\5343, 4000 \56DB\5343, 3000 \4E09\5343, 2000 \4E8C\5343, 1000 \5343, 900 \4E5D\767E, 800 \516B\767E, 700 \4E03\767E, 600 \516D\767E, 500 \4E94\767E, 400 \56DB\767E, 300 \4E09\767E, 200 \4E8C\767E, 100 \767E, 90 \4E5D\5341, 80 \516B\5341, 70 \4E03\5341, 60 \516D\5341, 50 \4E94\5341, 40 \56DB\5341, 30 \4E09\5341, 20 \4E8C\5341, 10 \5341, 9 \4E5D, 8 \516B, 7 \4E03, 6 \516D, 5 \4E94, 4 \56DB, 3 \4E09, 2 \4E8C, 1 \4E00, 0 \3007; /* additive-symbols: 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 一, 0 〇; */ suffix: '\3001'; /* suffix: '、'; */ negative: "\30DE\30A4\30CA\30B9"; /* negative: マイナス; */ fallback: cjk-decimal; } </bdo></code></p> <div id="out_japanese-informal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ja" style="list-style-type: japanese-informal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ja" style="list-style-type: japanese-informal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ja" style="list-style-type: japanese-informal;"><li>11</li></ol> <ol start="22" class="high" lang="ja" style="list-style-type: japanese-informal;"><li>22</li></ol> <ol start="33" class="high" lang="ja" style="list-style-type: japanese-informal;"><li>33</li></ol> <ol start="44" class="high" lang="ja" style="list-style-type: japanese-informal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ja" style="list-style-type: japanese-informal;"><li>111</li></ol> <ol start="222" class="high" lang="ja" style="list-style-type: japanese-informal;"><li>222</li></ol> <ol start="333" class="high" lang="ja" style="list-style-type: japanese-informal;"><li>333</li></ol> <ol start="444" class="high" lang="ja" style="list-style-type: japanese-informal;"><li>444</li></ol></div> </div></div> <script>addExamples('japanese-informal', 'ja', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('japanese-formal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="japanese-formal"><a href="#japanese-formal">japanese-formal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style japanese-formal { system: additive; range: -9999 9999; additive-symbols: 9000 \4E5D\9621, 8000 \516B\9621, 7000 \4E03\9621, 6000 \516D\9621, 5000 \4F0D\9621, 4000 \56DB\9621, 3000 \53C2\9621, 2000 \5F10\9621, 1000 \58F1\9621, 900 \4E5D\767E, 800 \516B\767E, 700 \4E03\767E, 600 \516D\767E, 500 \4F0D\767E, 400 \56DB\767E, 300 \53C2\767E, 200 \5F10\767E, 100 \58F1\767E, 90 \4E5D\62FE, 80 \516B\62FE, 70 \4E03\62FE, 60 \516D\62FE, 50 \4F0D\62FE, 40 \56DB\62FE, 30 \53C2\62FE, 20 \5F10\62FE, 10 \58F1\62FE, 9 \4E5D, 8 \516B, 7 \4E03, 6 \516D, 5 \4F0D, 4 \56DB, 3 \53C2, 2 \5F10, 1 \58F1, 0 \96F6; /* additive-symbols: 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 壱, 0 零; */ suffix: '\3001'; /* suffix: 、; */ negative: "\30DE\30A4\30CA\30B9"; /* negative: マイナス; */ fallback: cjk-decimal; } </bdo></code></p> <div id="out_japanese-formal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ja" style="list-style-type: japanese-formal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ja" style="list-style-type: japanese-formal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ja" style="list-style-type: japanese-formal;"><li>11</li></ol> <ol start="22" class="high" lang="ja" style="list-style-type: japanese-formal;"><li>22</li></ol> <ol start="33" class="high" lang="ja" style="list-style-type: japanese-formal;"><li>33</li></ol> <ol start="44" class="high" lang="ja" style="list-style-type: japanese-formal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ja" style="list-style-type: japanese-formal;"><li>111</li></ol> <ol start="222" class="high" lang="ja" style="list-style-type: japanese-formal;"><li>222</li></ol> <ol start="333" class="high" lang="ja" style="list-style-type: japanese-formal;"><li>333</li></ol> <ol start="444" class="high" lang="ja" style="list-style-type: japanese-formal;"><li>444</li></ol></div> </div></div> <script>addExamples('japanese-formal', 'ja', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-36"><div role="heading" class="note-title marker" id="h-note-36" aria-level="3"><span>Note</span></div><aside class=""> <p>All styles are defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplealphabetic" target="_blank">hiragana</a>, <a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplealphabetic" target="_blank">hiragana-iroha</a>, <a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplealphabetic" target="_blank">katakana</a>, <a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplealphabetic" target="_blank">katakana-iroha</a>, <a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#japanese" target="_blank">japanese-informal</a></code> and <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#japanese" target="_blank">japanese-formal</a></code> styles.</p> </aside></div> <div class="note" role="note" id="issue-container-generatedID-37"><div role="heading" class="note-title marker" id="h-note-37" aria-level="3"><span>Note</span></div><aside class=""> <p>See also the <a href="#chinese-styles">Han <abbr title="Chinese/Japanese/Korean">CJK</abbr></a> section for additional styles.</p> </aside></div> </section> <section id="javanese-styles"><div class="header-wrapper"><h2 id="x20-javanese"><bdi class="secno">20. </bdi>Javanese</h2><a class="self-link" href="#javanese-styles" aria-label="Permalink for Section 20."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('javanese')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="javanese"><a href="#javanese">javanese</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style javanese { system: numeric; symbols: \A9D0 \A9D1 \A9D2 \A9D3 \A9D4 \A9D5 \A9D6 \A9D7 \A9D8 \A9D9 ; /* symbols: ꧐ ꧑ ꧒ ꧓ ꧔ ꧕ ꧖ ꧗ ꧘ ꧙; */ } </bdo></code></p> <div id="out_javanese" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="jv" style="list-style-type: javanese; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="jv" style="list-style-type: javanese; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="jv" style="list-style-type: javanese;"><li>11</li></ol> <ol start="22" class="high" lang="jv" style="list-style-type: javanese;"><li>22</li></ol> <ol start="33" class="high" lang="jv" style="list-style-type: javanese;"><li>33</li></ol> <ol start="44" class="high" lang="jv" style="list-style-type: javanese;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="jv" style="list-style-type: javanese;"><li>111</li></ol> <ol start="222" class="high" lang="jv" style="list-style-type: javanese;"><li>222</li></ol> <ol start="333" class="high" lang="jv" style="list-style-type: javanese;"><li>333</li></ol> <ol start="444" class="high" lang="jv" style="list-style-type: javanese;"><li>444</li></ol></div> </div></div> <script>addExamples('javanese', 'jv', '')</script> </div> </section> <section id="kannada-styles"><div class="header-wrapper"><h2 id="x21-kannada"><bdi class="secno">21. </bdi>Kannada</h2><a class="self-link" href="#kannada-styles" aria-label="Permalink for Section 21."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('kannada')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="kannada"><a href="#kannada">kannada</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style kannada { system: numeric; symbols: '\CE6' '\CE7' '\CE8' '\CE9' '\CEA' '\CEB' '\CEC' '\CED' '\CEE' '\CEF'; /* symbols: '೦' '೧' '೨' '೩' '೪' '೫' '೬' '೭' '೮' '೯'; */ } </bdo></code></p> <div id="out_kannada" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="kn" style="list-style-type: kannada; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="kn" style="list-style-type: kannada; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="kn" style="list-style-type: kannada;"><li>11</li></ol> <ol start="22" class="high" lang="kn" style="list-style-type: kannada;"><li>22</li></ol> <ol start="33" class="high" lang="kn" style="list-style-type: kannada;"><li>33</li></ol> <ol start="44" class="high" lang="kn" style="list-style-type: kannada;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="kn" style="list-style-type: kannada;"><li>111</li></ol> <ol start="222" class="high" lang="kn" style="list-style-type: kannada;"><li>222</li></ol> <ol start="333" class="high" lang="kn" style="list-style-type: kannada;"><li>333</li></ol> <ol start="444" class="high" lang="kn" style="list-style-type: kannada;"><li>444</li></ol></div> </div></div> <script>addExamples('kannada', 'kn', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-38"><div role="heading" class="note-title marker" id="h-note-38" aria-level="3"><span>Note</span></div><aside class=""> <p>This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">kannada</a></code> style.</p> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('kannada-alpha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="kannada-alpha"><a href="#kannada-alpha">kannada-alpha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style kannada-alpha { system: alphabetic; symbols: '\0C85' '\0C86' '\0C87' '\0C88' '\0C89' '\0C8A' '\0C8B' '\0C8E' '\0C8F' '\0C90' '\0C92' '\0C93' '\0C94' '\0C95' '\0C96' '\0C97' '\0C98' '\0C99' ; /* symbols: 'ಅ' 'ಆ' 'ಇ' 'ಈ' 'ಉ' 'ಊ' 'ಋ' 'ಎ' 'ಏ' 'ಐ' 'ಒ' 'ಓ' 'ಔ' 'ಕ' 'ಖ' 'ಗ' 'ಘ' 'ಙ'; */ suffix: ') '; } </bdo></code></p> <div id="out_kannada-alpha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="kn" style="list-style-type: kannada-alpha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="kn" style="list-style-type: kannada-alpha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="kn" style="list-style-type: kannada-alpha;"><li>11</li></ol> <ol start="22" class="high" lang="kn" style="list-style-type: kannada-alpha;"><li>22</li></ol> <ol start="33" class="high" lang="kn" style="list-style-type: kannada-alpha;"><li>33</li></ol> <ol start="44" class="high" lang="kn" style="list-style-type: kannada-alpha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="kn" style="list-style-type: kannada-alpha;"><li>111</li></ol> <ol start="222" class="high" lang="kn" style="list-style-type: kannada-alpha;"><li>222</li></ol> <ol start="333" class="high" lang="kn" style="list-style-type: kannada-alpha;"><li>333</li></ol> <ol start="444" class="high" lang="kn" style="list-style-type: kannada-alpha;"><li>444</li></ol></div> </div></div> <script>addExamples('kannada-alpha', 'kn', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-39"><div role="heading" class="note-title marker" id="h-note-39" aria-level="3"><span>Note</span></div><aside class=""> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style kannada-alpha-dbl-paren { system: extends kannada-alpha; prefix: '('; suffix: ") "; } </bdo></code></li> </ol> </aside></div> </section> <section id="kayah-li-styles"><div class="header-wrapper"><h2 id="x22-kayah-li"><bdi class="secno">22. </bdi>Kayah Li</h2><a class="self-link" href="#kayah-li-styles" aria-label="Permalink for Section 22."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('kayah-li')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="kayah-li"><a href="#kayah-li">kayah-li</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style kayah-li { system: numeric; symbols: '\A901' '\A902' '\A903' '\A904' '\A905' '\A906' '\A907' '\A908' '\A909' '\A900'; /* symbols: ꤁ ꤂ ꤃ ꤄ ꤅ ꤆ ꤇ ꤈ ꤉ ꤀; */ } </bdo></code></p> <div id="out_kayah-li" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="kyu" style="list-style-type: kayah-li; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="kyu" style="list-style-type: kayah-li; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="kyu" style="list-style-type: kayah-li;"><li>11</li></ol> <ol start="22" class="high" lang="kyu" style="list-style-type: kayah-li;"><li>22</li></ol> <ol start="33" class="high" lang="kyu" style="list-style-type: kayah-li;"><li>33</li></ol> <ol start="44" class="high" lang="kyu" style="list-style-type: kayah-li;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="kyu" style="list-style-type: kayah-li;"><li>111</li></ol> <ol start="222" class="high" lang="kyu" style="list-style-type: kayah-li;"><li>222</li></ol> <ol start="333" class="high" lang="kyu" style="list-style-type: kayah-li;"><li>333</li></ol> <ol start="444" class="high" lang="kyu" style="list-style-type: kayah-li;"><li>444</li></ol></div> </div></div> <script>addExamples('kayah-li', 'kyu', '')</script> </div> </section> <section id="khmer-styles"><div class="header-wrapper"><h2 id="x23-khmer"><bdi class="secno">23. </bdi>Khmer</h2><a class="self-link" href="#khmer-styles" aria-label="Permalink for Section 23."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('cambodian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="cambodian"><a href="#cambodian">cambodian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style cambodian { system: numeric; symbols: '\17E0' '\17E1' '\17E2' '\17E3' '\17E4' '\17E5' '\17E6' '\17E7' '\17E8' '\17E9'; /* symbols: '០' '១' '២' '៣' '៤' '៥' '៦' '៧' '៨' '៩'; */ } </bdo></code></p> <div id="out_cambodian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="km" style="list-style-type: cambodian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="km" style="list-style-type: cambodian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="km" style="list-style-type: cambodian;"><li>11</li></ol> <ol start="22" class="high" lang="km" style="list-style-type: cambodian;"><li>22</li></ol> <ol start="33" class="high" lang="km" style="list-style-type: cambodian;"><li>33</li></ol> <ol start="44" class="high" lang="km" style="list-style-type: cambodian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="km" style="list-style-type: cambodian;"><li>111</li></ol> <ol start="222" class="high" lang="km" style="list-style-type: cambodian;"><li>222</li></ol> <ol start="333" class="high" lang="km" style="list-style-type: cambodian;"><li>333</li></ol> <ol start="444" class="high" lang="km" style="list-style-type: cambodian;"><li>444</li></ol></div> </div></div> <script>addExamples('cambodian', 'km', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('khmer')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="khmer"><a href="#khmer">khmer</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style khmer { system: numeric; symbols: '\17E0' '\17E1' '\17E2' '\17E3' '\17E4' '\17E5' '\17E6' '\17E7' '\17E8' '\17E9'; /* symbols: '០' '១' '២' '៣' '៤' '៥' '៦' '៧' '៨' '៩'; */ } </bdo></code></p> <div id="out_khmer" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="km" style="list-style-type: khmer; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="km" style="list-style-type: khmer; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="km" style="list-style-type: khmer;"><li>11</li></ol> <ol start="22" class="high" lang="km" style="list-style-type: khmer;"><li>22</li></ol> <ol start="33" class="high" lang="km" style="list-style-type: khmer;"><li>33</li></ol> <ol start="44" class="high" lang="km" style="list-style-type: khmer;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="km" style="list-style-type: khmer;"><li>111</li></ol> <ol start="222" class="high" lang="km" style="list-style-type: khmer;"><li>222</li></ol> <ol start="333" class="high" lang="km" style="list-style-type: khmer;"><li>333</li></ol> <ol start="444" class="high" lang="km" style="list-style-type: khmer;"><li>444</li></ol></div> </div></div> <script>addExamples('khmer', 'km', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-40"><div role="heading" class="note-title marker" id="h-note-40" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">cambodian</code> and <code class="kw" translate="no">khmer</code> styles are exactly the same. Both are listed separately here because both names are supported in some browsers, and it makes it easier to cut and paste if two clean instances are provided.</p> </aside></div> <div class="note" role="note" id="issue-container-generatedID-41"><div role="heading" class="note-title marker" id="h-note-41" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">cambodian</code> and <code class="kw" translate="no">khmer</code> styles are defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">cambodian</a></code> and <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">khmer</a></code> styles.</p> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('khmer-consonant')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="khmer-consonant"><a href="#khmer-consonant">khmer-consonant</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style khmer-consonant { system: alphabetic; symbols: '\1780' '\1781' '\1782' '\1783' '\1784' '\1785' '\1786' '\1787' '\1788' '\1789' '\178A' '\178B' '\178C' '\178D' '\178E' '\178F' '\1790' '\1791' '\1792' '\1793' '\1794' '\1795' '\1796' '\1797' '\1798' '\1799' '\179A' '\179B' '\179C' '\179F' '\17A0' '\17A1' '\17A2'; /* symbols: 'ក' 'ខ' 'គ' 'ឃ' 'ង' 'ច' 'ឆ' 'ជ' 'ឈ' 'ញ' 'ដ' 'ឋ' 'ឌ' 'ឍ' 'ណ' 'ត' 'ថ' 'ទ' 'ធ' 'ន' 'ប' 'ផ' 'ព' 'ភ' 'ម' 'យ' 'រ' 'ល' 'វ' 'ស' 'ហ' 'ឡ' 'អ'; */ } </bdo></code></p> <div id="out_khmer-consonant" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="km" style="list-style-type: khmer-consonant; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="km" style="list-style-type: khmer-consonant; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="km" style="list-style-type: khmer-consonant;"><li>11</li></ol> <ol start="22" class="high" lang="km" style="list-style-type: khmer-consonant;"><li>22</li></ol> <ol start="33" class="high" lang="km" style="list-style-type: khmer-consonant;"><li>33</li></ol> <ol start="44" class="high" lang="km" style="list-style-type: khmer-consonant;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="km" style="list-style-type: khmer-consonant;"><li>111</li></ol> <ol start="222" class="high" lang="km" style="list-style-type: khmer-consonant;"><li>222</li></ol> <ol start="333" class="high" lang="km" style="list-style-type: khmer-consonant;"><li>333</li></ol> <ol start="444" class="high" lang="km" style="list-style-type: khmer-consonant;"><li>444</li></ol></div> </div></div> <script>addExamples('khmer-consonant', 'km', '')</script> </div> </section> <section id="korean-styles"><div class="header-wrapper"><h2 id="x24-korean"><bdi class="secno">24. </bdi>Korean</h2><a class="self-link" href="#korean-styles" aria-label="Permalink for Section 24."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('circled-korean-consonant')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="circled-korean-consonant"><a href="#circled-korean-consonant">circled-korean-consonant</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style circled-korean-consonant { system: fixed; symbols: '\3260' '\3261' '\3262' '\3263' '\3264' '\3265' '\3266' '\3267' '\3268' '\3269' '\326A' '\326B' '\326C' '\326D'; /* symbols: '㉠' '㉡' '㉢' '㉣' '㉤' '㉥' '㉦' '㉧' '㉨' '㉩' '㉪' '㉫' '㉬' '㉭'; */ suffix: ' '; } </bdo></code></p> <div id="out_circled-korean-consonant" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: circled-korean-consonant; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: circled-korean-consonant; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: circled-korean-consonant;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: circled-korean-consonant;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: circled-korean-consonant;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: circled-korean-consonant;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: circled-korean-consonant;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: circled-korean-consonant;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: circled-korean-consonant;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: circled-korean-consonant;"><li>444</li></ol></div> </div></div> <script>addExamples('circled-korean-consonant', 'ko', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('circled-korean-syllable')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="circled-korean-syllable"><a href="#circled-korean-syllable">circled-korean-syllable</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style circled-korean-syllable { system: fixed; symbols: '\326E' '\326F' '\3270' '\3271' '\3272' '\3273' '\3274' '\3275' '\3276' '\3277' '\3278' '\3279' '\327A' '\327B'; /* symbols: '㉮' '㉯' '㉰' '㉱' '㉲' '㉳' '㉴' '㉵' '㉶' '㉷' '㉸' '㉹' '㉺' '㉻'; */ suffix: ' '; } </bdo></code></p> <div id="out_circled-korean-syllable" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: circled-korean-syllable; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: circled-korean-syllable; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: circled-korean-syllable;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: circled-korean-syllable;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: circled-korean-syllable;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: circled-korean-syllable;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: circled-korean-syllable;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: circled-korean-syllable;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: circled-korean-syllable;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: circled-korean-syllable;"><li>444</li></ol></div> </div></div> <script>addExamples('circled-korean-syllable', 'ko', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('hangul')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="hangul"><a href="#hangul">hangul</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style hangul { system: alphabetic; symbols: '\AC00' '\B098' '\B2E4' '\B77C' '\B9C8' '\BC14' '\C0AC' '\C544' '\C790' '\CC28' '\CE74' '\D0C0' '\D30C' '\D558'; /* symbols: '가' '나' '다' '라' '마' '바' '사' '아' '자' '차' '카' '타' '파' '하'; */ } </bdo></code></p> <div id="out_hangul" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: hangul; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: hangul; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: hangul;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: hangul;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: hangul;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: hangul;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: hangul;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: hangul;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: hangul;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: hangul;"><li>444</li></ol></div> </div></div> <script>addExamples('hangul', 'ko', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('hangul-consonant')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="hangul-consonant"><a href="#hangul-consonant">hangul-consonant</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style hangul-consonant { system: alphabetic; symbols: '\3131' '\3134' '\3137' '\3139' '\3141' '\3142' '\3145' '\3147' '\3148' '\314A' '\314B' '\314C' '\314D' '\314E'; /* symbols: 'ㄱ' 'ㄴ' 'ㄷ' 'ㄹ' 'ㅁ' 'ㅂ' 'ㅅ' 'ㅇ' 'ㅈ' 'ㅊ' 'ㅋ' 'ㅌ' 'ㅍ' 'ㅎ'; */ } </bdo></code></p> <div id="out_hangul-consonant" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: hangul-consonant; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: hangul-consonant; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: hangul-consonant;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: hangul-consonant;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: hangul-consonant;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: hangul-consonant;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: hangul-consonant;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: hangul-consonant;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: hangul-consonant;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: hangul-consonant;"><li>444</li></ol></div> </div></div> <script>addExamples('hangul-consonant', 'ko', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-42"><div role="heading" class="note-title marker" id="h-note-42" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">hangul</code> and <code class="kw" translate="no">hangul-consonant</code> styles are built-in styles in Blink and Webkit, but none work out of the box in Firefox. Use the templates provided here if you want those names to work on all browsers that support counter-styles definitions.</p> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('korean-consonant')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="korean-consonant"><a href="#korean-consonant">korean-consonant</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style korean-consonant { system: alphabetic; symbols: '\3131' '\3134' '\3137' '\3139' '\3141' '\3142' '\3145' '\3147' '\3148' '\314A' '\314B' '\314C' '\314D' '\314E'; /* symbols: 'ㄱ' 'ㄴ' 'ㄷ' 'ㄹ' 'ㅁ' 'ㅂ' 'ㅅ' 'ㅇ' 'ㅈ' 'ㅊ' 'ㅋ' 'ㅌ' 'ㅍ' 'ㅎ'; */ } </bdo></code></p> <div id="out_korean-consonant" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: korean-consonant; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: korean-consonant; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: korean-consonant;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: korean-consonant;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: korean-consonant;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: korean-consonant;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: korean-consonant;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: korean-consonant;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: korean-consonant;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: korean-consonant;"><li>444</li></ol></div> </div></div> <script>addExamples('korean-consonant', 'ko', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-43"><div role="heading" class="note-title marker" id="h-note-43" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">hangul-consonant</code> and <code class="kw" translate="no">korean-consonant</code> styles are identical, apart from the name.</p> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('korean-hangul-formal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="korean-hangul-formal"><a href="#korean-hangul-formal">korean-hangul-formal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style korean-hangul-formal { system: additive; range: -9999 9999; additive-symbols: 9000 '\AD6C\CC9C', 8000 '\D314\CC9C', 7000 '\CE60\CC9C', 6000 '\C721\CC9C', 5000 '\C624\CC9C', 4000 '\C0AC\CC9C', 3000 '\C0BC\CC9C', 2000 '\C774\CC9C', 1000 '\C77C\CC9C', 900 '\AD6C\BC31', 800 '\D314\BC31', 700 '\CE60\BC31', 600 '\C721\BC31', 500 '\C624\BC31', 400 '\C0AC\BC31', 300 '\C0BC\BC31', 200 '\C774\BC31', 100 '\C77C\BC31', 90 '\AD6C\C2ED', 80 '\D314\C2ED', 70 '\CE60\C2ED', 60 '\C721\C2ED', 50 '\C624\C2ED', 40 '\C0AC\C2ED', 30 '\C0BC\C2ED', 20 '\C774\C2ED', 10 '\C77C\C2ED', 9 '\AD6C', 8 '\D314', 7 '\CE60', 6 '\C721', 5 '\C624', 4 '\C0AC', 3 '\C0BC', 2 '\C774', 1 '\C77C', 0 '\C601'; /* additive-symbols: 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 일, 0 영 */ suffix:', '; negative: "\B9C8\C774\B108\C2A4 "; /* 마이너스 (followed by a space) */ } </bdo></code></p> <div id="out_korean-hangul-formal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: korean-hangul-formal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: korean-hangul-formal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: korean-hangul-formal;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: korean-hangul-formal;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: korean-hangul-formal;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: korean-hangul-formal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: korean-hangul-formal;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: korean-hangul-formal;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: korean-hangul-formal;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: korean-hangul-formal;"><li>444</li></ol></div> </div></div> <script>addExamples('korean-hangul-formal', 'ko', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('korean-syllable')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="korean-syllable"><a href="#korean-syllable">korean-syllable</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style korean-syllable { system: alphabetic; symbols: '\AC00' '\B098' '\B2E4' '\B77C' '\B9C8' '\BC14' '\C0AC' '\C544' '\C790' '\CC28' '\CE74' '\D0C0' '\D30C' '\D558'; /* symbols: '가' '나' '다' '라' '마' '바' '사' '아' '자' '차' '카' '타' '파' '하'; */ } </bdo></code></p> <div id="out_korean-syllable" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: korean-syllable; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: korean-syllable; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: korean-syllable;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: korean-syllable;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: korean-syllable;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: korean-syllable;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: korean-syllable;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: korean-syllable;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: korean-syllable;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: korean-syllable;"><li>444</li></ol></div> </div></div> <script>addExamples('korean-syllable', 'ko', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('parenthesized-hangul-consonant')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="parenthesized-hangul-consonant"><a href="#parenthesized-hangul-consonant">parenthesized-hangul-consonant</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style parenthesized-hangul-consonant { system: fixed; symbols: '\3200' '\3201' '\3202' '\3203' '\3204' '\3205' '\3206' '\3207' '\3208' '\3209' '\320A' '\320B' '\320C' '\320D'; /* symbols: '㈀' '㈁' '㈂' '㈃' '㈄' '㈅' '㈆' '㈇' '㈈' '㈉' '㈊' '㈋' '㈌' '㈍'; */ suffix: ' '; } </bdo></code></p> <div id="out_parenthesized-hangul-consonant" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: parenthesized-hangul-consonant; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: parenthesized-hangul-consonant; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: parenthesized-hangul-consonant;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: parenthesized-hangul-consonant;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: parenthesized-hangul-consonant;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: parenthesized-hangul-consonant;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: parenthesized-hangul-consonant;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: parenthesized-hangul-consonant;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: parenthesized-hangul-consonant;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: parenthesized-hangul-consonant;"><li>444</li></ol></div> </div></div> <script>addExamples('parenthesized-hangul-consonant', 'ko', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('parenthesized-hangul-syllable')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="parenthesized-hangul-syllable"><a href="#parenthesized-hangul-syllable">parenthesized-hangul-syllable</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style parenthesized-hangul-syllable { system: fixed; symbols: '\320E' '\320F' '\3210' '\3211' '\3212' '\3213' '\3214' '\3215' '\3216' '\3217' '\3218' '\3219' '\321A'; /* symbols: '㈎' '㈏' '㈐' '㈑' '㈒' '㈓' '㈔' '㈕' '㈖' '㈗' '㈘' '㈙' '㈚'; */ suffix: ' '; } </bdo></code></p> <div id="out_parenthesized-hangul-syllable" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: parenthesized-hangul-syllable; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: parenthesized-hangul-syllable; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: parenthesized-hangul-syllable;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: parenthesized-hangul-syllable;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: parenthesized-hangul-syllable;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: parenthesized-hangul-syllable;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: parenthesized-hangul-syllable;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: parenthesized-hangul-syllable;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: parenthesized-hangul-syllable;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: parenthesized-hangul-syllable;"><li>444</li></ol></div> </div></div> <script>addExamples('parenthesized-hangul-syllable', 'ko', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('korean-hanja-informal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="korean-hanja-informal"><a href="#korean-hanja-informal">korean-hanja-informal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style korean-hanja-informal { system: additive; range: -9999 9999; additive-symbols: 9000 \4E5D\5343, 8000 \516B\5343, 7000 \4E03\5343, 6000 \516D\5343, 5000 \4E94\5343, 4000 \56DB\5343, 3000 \4E09\5343, 2000 \4E8C\5343, 1000 \5343, 900 \4E5D\767E, 800 \516B\767E, 700 \4E03\767E, 600 \516D\767E, 500 \4E94\767E, 400 \56DB\767E, 300 \4E09\767E, 200 \4E8C\767E, 100 \767E, 90 \4E5D\5341, 80 \516B\5341, 70 \4E03\5341, 60 \516D\5341, 50 \4E94\5341, 40 \56DB\5341, 30 \4E09\5341, 20 \4E8C\5341, 10 \5341, 9 \4E5D, 8 \516B, 7 \4E03, 6 \516D, 5 \4E94, 4 \56DB, 3 \4E09, 2 \4E8C, 1 \4E00, 0 \96F6; /* additive-symbols: 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 一, 0 零; */ suffix:', '; negative: "\B9C8\C774\B108\C2A4 "; /* 마이너스 (followed by a space) */ } </bdo></code></p> <div id="out_korean-hanja-informal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: korean-hanja-informal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: korean-hanja-informal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: korean-hanja-informal;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: korean-hanja-informal;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: korean-hanja-informal;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: korean-hanja-informal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: korean-hanja-informal;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: korean-hanja-informal;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: korean-hanja-informal;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: korean-hanja-informal;"><li>444</li></ol></div> </div></div> <script>addExamples('korean-hanja-informal', 'ko', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('korean-hanja-formal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="korean-hanja-formal"><a href="#korean-hanja-formal">korean-hanja-formal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style korean-hanja-formal { system: additive; range: -9999 9999; additive-symbols: 9000 \4E5D\4EDF, 8000 \516B\4EDF, 7000 \4E03\4EDF, 6000 \516D\4EDF, 5000 \4E94\4EDF, 4000 \56DB\4EDF, 3000 \53C3\4EDF, 2000 \8CB3\4EDF, 1000 \58F9\4EDF, 900 \4E5D\767E, 800 \516B\767E, 700 \4E03\767E, 600 \516D\767E, 500 \4E94\767E, 400 \56DB\767E, 300 \53C3\767E, 200 \8CB3\767E, 100 \58F9\767E, 90 \4E5D\62FE, 80 \516B\62FE, 70 \4E03\62FE, 60 \516D\62FE, 50 \4E94\62FE, 40 \56DB\62FE, 30 \53C3\62FE, 20 \8CB3\62FE, 10 \58F9\62FE, 9 \4E5D, 8 \516B, 7 \4E03, 6 \516D, 5 \4E94, 4 \56DB, 3 \53C3, 2 \8CB3, 1 \58F9, 0 \96F6; /* additive-symbols: 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 壹, 0 零; */ suffix:', '; negative: "\B9C8\C774\B108\C2A4 "; /* 마이너스 (followed by a space) */ } </bdo></code></p> <div id="out_korean-hanja-formal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ko" style="list-style-type: korean-hanja-formal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ko" style="list-style-type: korean-hanja-formal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ko" style="list-style-type: korean-hanja-formal;"><li>11</li></ol> <ol start="22" class="high" lang="ko" style="list-style-type: korean-hanja-formal;"><li>22</li></ol> <ol start="33" class="high" lang="ko" style="list-style-type: korean-hanja-formal;"><li>33</li></ol> <ol start="44" class="high" lang="ko" style="list-style-type: korean-hanja-formal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ko" style="list-style-type: korean-hanja-formal;"><li>111</li></ol> <ol start="222" class="high" lang="ko" style="list-style-type: korean-hanja-formal;"><li>222</li></ol> <ol start="333" class="high" lang="ko" style="list-style-type: korean-hanja-formal;"><li>333</li></ol> <ol start="444" class="high" lang="ko" style="list-style-type: korean-hanja-formal;"><li>444</li></ol></div> </div></div> <script>addExamples('korean-hanja-formal', 'ko', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-44"><div role="heading" class="note-title marker" id="h-note-44" aria-level="3"><span>Note</span></div><aside class=""> <p id="korean_alt_affix"><strong>Alternative affix styles:</strong> Many of the Korean styles listed here use <span class="codepoint" translate="no"><span lang="ko">, </span> [<span class="uname">U+002C COMMA</span> + <span class="uname">U+0020 SPACE</span>]</span> as the default suffix, however sometimes <span class="codepoint" translate="no"><span lang="zh">. </span> [<span class="uname">U+002E FULL STOP</span> + <span class="uname">U+0020 SPACE</span>]</span> is preferred. To apply that to the styles above, replace the suffix declarations with:<br> <code> <bdo dir="ltr">suffix: \002E\0020; /*. */ </bdo> </code></p> </aside></div> <div class="note" role="note" id="issue-container-generatedID-45"><div role="heading" class="note-title marker" id="h-note-45" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">korean-hangul-formal</code>, <code class="kw" translate="no">korean-hanja-formal</code>, and <code class="kw" translate="no">korean-hanja-informal</code> styles are defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#korean" target="_blank">korean-hangul-formal</a></code>, <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#korean" target="_blank">korean-hanja-formal</a></code> and <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#korean" target="_blank">korean-hanja-informal</a></code> styles.</p> </aside></div> <div class="note" role="note" id="issue-container-generatedID-46"><div role="heading" class="note-title marker" id="h-note-46" aria-level="3"><span>Note</span></div><aside class=""> <p>See also the <a href="#chinese-styles">Han <abbr title="Chinese/Japanese/Korean">CJK</abbr></a> section for additional styles.</p> </aside></div> </section> <section id="lanna-styles"><div class="header-wrapper"><h2 id="x25-lanna-tai-tham"><bdi class="secno">25. </bdi>Lanna (Tai Tham)</h2><a class="self-link" href="#lanna-styles" aria-label="Permalink for Section 25."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lanna-hora')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lanna-hora"><a href="#lanna-hora">lanna-hora</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lanna-hora { system: numeric; symbols: '\1A80' '\1A81' '\1A82' '\1A83' '\1A84' '\1A85' '\1A86' '\1A87' '\1A88' '\1A89'; /* symbols: ᪀ ᪁ ᪂ ᪃ ᪄ ᪅ ᪆ ᪇ ᪈ ᪉; */ } </bdo></code></p> <div id="out_lanna-hora" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="nod" style="list-style-type: lanna-hora; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="nod" style="list-style-type: lanna-hora; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="nod" style="list-style-type: lanna-hora;"><li>11</li></ol> <ol start="22" class="high" lang="nod" style="list-style-type: lanna-hora;"><li>22</li></ol> <ol start="33" class="high" lang="nod" style="list-style-type: lanna-hora;"><li>33</li></ol> <ol start="44" class="high" lang="nod" style="list-style-type: lanna-hora;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="nod" style="list-style-type: lanna-hora;"><li>111</li></ol> <ol start="222" class="high" lang="nod" style="list-style-type: lanna-hora;"><li>222</li></ol> <ol start="333" class="high" lang="nod" style="list-style-type: lanna-hora;"><li>333</li></ol> <ol start="444" class="high" lang="nod" style="list-style-type: lanna-hora;"><li>444</li></ol></div> </div></div> <script>addExamples('lanna-hora', 'nod', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lanna-tham')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lanna-tham"><a href="#lanna-tham">lanna-tham</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lanna-tham { system: numeric; symbols: '\1A90' '\1A91' '\1A92' '\1A93' '\1A94' '\1A95' '\1A96' '\1A97' '\1A98' '\1A99'; /* symbols: ᪐ ᪑ ᪒ ᪓ ᪔ ᪕ ᪖ ᪗ ᪘ ᪙; */ } </bdo></code></p> <div id="out_lanna-tham" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="nod" style="list-style-type: lanna-tham; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="nod" style="list-style-type: lanna-tham; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="nod" style="list-style-type: lanna-tham;"><li>11</li></ol> <ol start="22" class="high" lang="nod" style="list-style-type: lanna-tham;"><li>22</li></ol> <ol start="33" class="high" lang="nod" style="list-style-type: lanna-tham;"><li>33</li></ol> <ol start="44" class="high" lang="nod" style="list-style-type: lanna-tham;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="nod" style="list-style-type: lanna-tham;"><li>111</li></ol> <ol start="222" class="high" lang="nod" style="list-style-type: lanna-tham;"><li>222</li></ol> <ol start="333" class="high" lang="nod" style="list-style-type: lanna-tham;"><li>333</li></ol> <ol start="444" class="high" lang="nod" style="list-style-type: lanna-tham;"><li>444</li></ol></div> </div></div> <script>addExamples('lanna-tham', 'nod', '')</script> </div> </section> <section id="lao-styles"><div class="header-wrapper"><h2 id="x26-lao"><bdi class="secno">26. </bdi>Lao</h2><a class="self-link" href="#lao-styles" aria-label="Permalink for Section 26."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lao')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lao"><a href="#lao">lao</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lao { system: numeric; symbols: '\ED0' '\ED1' '\ED2' '\ED3' '\ED4' '\ED5' '\ED6' '\ED7' '\ED8' '\ED9'; /* symbols: '໐' '໑' '໒' '໓' '໔' '໕' '໖' '໗' '໘' '໙'; */ } </bdo></code></p> <div id="out_lao" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="lo" style="list-style-type: lao; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="lo" style="list-style-type: lao; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="lo" style="list-style-type: lao;"><li>11</li></ol> <ol start="22" class="high" lang="lo" style="list-style-type: lao;"><li>22</li></ol> <ol start="33" class="high" lang="lo" style="list-style-type: lao;"><li>33</li></ol> <ol start="44" class="high" lang="lo" style="list-style-type: lao;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="lo" style="list-style-type: lao;"><li>111</li></ol> <ol start="222" class="high" lang="lo" style="list-style-type: lao;"><li>222</li></ol> <ol start="333" class="high" lang="lo" style="list-style-type: lao;"><li>333</li></ol> <ol start="444" class="high" lang="lo" style="list-style-type: lao;"><li>444</li></ol></div> </div></div> <script>addExamples('lao', 'lo', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-47"><div role="heading" class="note-title marker" id="h-note-47" aria-level="3"><span>Note</span></div><aside class=""> <p>This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">lao</a></code> style.</p> </aside></div> </section> <section id="latin-styles"><div class="header-wrapper"><h2 id="x27-latin"><bdi class="secno">27. </bdi>Latin</h2><a class="self-link" href="#latin-styles" aria-label="Permalink for Section 27."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-alpha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-alpha"><a href="#lower-alpha">lower-alpha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-alpha { system: alphabetic; symbols: '\61' '\62' '\63' '\64' '\65' '\66' '\67' '\68' '\69' '\6A' '\6B' '\6C' '\6D' '\6E' '\6F' '\70' '\71' '\72' '\73' '\74' '\75' '\76' '\77' '\78' '\79' '\7A'; /* 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'; */ } </bdo></code></p> <div id="out_lower-alpha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: lower-alpha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: lower-alpha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: lower-alpha;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: lower-alpha;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: lower-alpha;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: lower-alpha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: lower-alpha;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: lower-alpha;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: lower-alpha;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: lower-alpha;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-alpha', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-alpha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-alpha"><a href="#upper-alpha">upper-alpha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-alpha { system: alphabetic; symbols: '\41' '\42' '\43' '\44' '\45' '\46' '\47' '\48' '\49' '\4A' '\4B' '\4C' '\4D' '\4E' '\4F' '\50' '\51' '\52' '\53' '\54' '\55' '\56' '\57' '\58' '\59' '\5A'; /* 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'; */ } </bdo></code></p> <div id="out_upper-alpha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: upper-alpha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: upper-alpha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: upper-alpha;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: upper-alpha;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: upper-alpha;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: upper-alpha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: upper-alpha;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: upper-alpha;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: upper-alpha;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: upper-alpha;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-alpha', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('fullwidth-lower-alpha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="fullwidth-lower-alpha"><a href="#fullwidth-lower-alpha">fullwidth-lower-alpha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style fullwidth-lower-alpha { system: alphabetic; symbols: '\FF41' '\FF42' '\FF43' '\FF44' '\FF45' '\FF46' '\FF47' '\FF48' '\FF49' '\FF4A' '\FF4B' '\FF4C' '\FF4D' '\FF4E' '\FF4F' '\FF50' '\FF51' '\FF52' '\FF53' '\FF54' '\FF55' '\FF56' '\FF57' '\FF58' '\FF59' '\FF5A'; /* symbols: 'ａ' 'ｂ' 'ｃ' 'ｄ' 'ｅ' 'ｆ' 'ｇ' 'ｈ' 'ｉ' 'ｊ' 'ｋ' 'ｌ' 'ｍ' 'ｎ' 'ｏ' 'ｐ' 'ｑ' 'ｒ' 'ｓ' 'ｔ' 'ｕ' 'ｖ' 'ｗ' 'ｘ' 'ｙ' 'ｚ'; */ suffix: '\FF0E'; } </bdo></code></p> <div id="out_fullwidth-lower-alpha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ja" style="list-style-type: fullwidth-lower-alpha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ja" style="list-style-type: fullwidth-lower-alpha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ja" style="list-style-type: fullwidth-lower-alpha;"><li>11</li></ol> <ol start="22" class="high" lang="ja" style="list-style-type: fullwidth-lower-alpha;"><li>22</li></ol> <ol start="33" class="high" lang="ja" style="list-style-type: fullwidth-lower-alpha;"><li>33</li></ol> <ol start="44" class="high" lang="ja" style="list-style-type: fullwidth-lower-alpha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ja" style="list-style-type: fullwidth-lower-alpha;"><li>111</li></ol> <ol start="222" class="high" lang="ja" style="list-style-type: fullwidth-lower-alpha;"><li>222</li></ol> <ol start="333" class="high" lang="ja" style="list-style-type: fullwidth-lower-alpha;"><li>333</li></ol> <ol start="444" class="high" lang="ja" style="list-style-type: fullwidth-lower-alpha;"><li>444</li></ol></div> </div></div> <script>addExamples('fullwidth-lower-alpha', 'ja', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('fullwidth-upper-alpha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="fullwidth-upper-alpha"><a href="#fullwidth-upper-alpha">fullwidth-upper-alpha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style fullwidth-upper-alpha { system: alphabetic; symbols: '\FF21' '\FF22' '\FF23' '\FF24' '\FF25' '\FF26' '\FF27' '\FF28' '\FF29' '\FF2A' '\FF2B' '\FF2C' '\FF2D' '\FF2E' '\FF2F' '\FF30' '\FF31' '\FF32' '\FF33' '\FF34' '\FF35' '\FF36' '\FF37' '\FF38' '\FF39' '\FF3A'; /* symbols: 'Ａ' 'Ｂ' 'Ｃ' 'Ｄ' 'Ｅ' 'Ｆ' 'Ｇ' 'Ｈ' 'Ｉ' 'Ｊ' 'Ｋ' 'Ｌ' 'Ｍ' 'Ｎ' 'Ｏ' 'Ｐ' 'Ｑ' 'Ｒ' 'Ｓ' 'Ｔ' 'Ｕ' 'Ｖ' 'Ｗ' 'Ｘ' 'Ｙ' 'Ｚ'; */ suffix: '\FF0E'; } </bdo></code></p> <div id="out_fullwidth-upper-alpha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ja" style="list-style-type: fullwidth-upper-alpha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ja" style="list-style-type: fullwidth-upper-alpha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ja" style="list-style-type: fullwidth-upper-alpha;"><li>11</li></ol> <ol start="22" class="high" lang="ja" style="list-style-type: fullwidth-upper-alpha;"><li>22</li></ol> <ol start="33" class="high" lang="ja" style="list-style-type: fullwidth-upper-alpha;"><li>33</li></ol> <ol start="44" class="high" lang="ja" style="list-style-type: fullwidth-upper-alpha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ja" style="list-style-type: fullwidth-upper-alpha;"><li>111</li></ol> <ol start="222" class="high" lang="ja" style="list-style-type: fullwidth-upper-alpha;"><li>222</li></ol> <ol start="333" class="high" lang="ja" style="list-style-type: fullwidth-upper-alpha;"><li>333</li></ol> <ol start="444" class="high" lang="ja" style="list-style-type: fullwidth-upper-alpha;"><li>444</li></ol></div> </div></div> <script>addExamples('fullwidth-upper-alpha', 'ja', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-alpha-symbolic')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-alpha-symbolic"><a href="#lower-alpha-symbolic">lower-alpha-symbolic</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-alpha-symbolic { system: symbolic; symbols: '\61' '\62' '\63' '\64' '\65' '\66' '\67' '\68' '\69' '\6A' '\6B' '\6C' '\6D' '\6E' '\6F' '\70' '\71' '\72' '\73' '\74' '\75' '\76' '\77' '\78' '\79' '\7A'; /* 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'; */ } </bdo></code></p> <div id="out_lower-alpha-symbolic" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: lower-alpha-symbolic; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: lower-alpha-symbolic; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: lower-alpha-symbolic;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: lower-alpha-symbolic;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: lower-alpha-symbolic;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: lower-alpha-symbolic;"><li>44</li></ol></div></div> </div> <script>addExamples('lower-alpha-symbolic', 'en', '', 'short')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-alpha-symbolic')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-alpha-symbolic"><a href="#upper-alpha-symbolic">upper-alpha-symbolic</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-alpha-symbolic { system: symbolic; symbols: '\41' '\42' '\43' '\44' '\45' '\46' '\47' '\48' '\49' '\4A' '\4B' '\4C' '\4D' '\4E' '\4F' '\50' '\51' '\52' '\53' '\54' '\55' '\56' '\57' '\58' '\59' '\5A'; /* 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'; */ } </bdo></code></p> <div id="out_upper-alpha-symbolic" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: upper-alpha-symbolic; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: upper-alpha-symbolic; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: upper-alpha-symbolic;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: upper-alpha-symbolic;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: upper-alpha-symbolic;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: upper-alpha-symbolic;"><li>44</li></ol></div></div> </div> <script>addExamples('upper-alpha-symbolic', 'en', '', 'short')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-oromo-qubee')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-oromo-qubee"><a href="#lower-oromo-qubee">lower-oromo-qubee</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-oromo-qubee { system: alphabetic; symbols: '\61' '\61\61' '\62' '\63' '\64' '\65' '\65\65' '\66' '\67' '\68' '\69' '\69\69' '\6A' '\6B' '\6C' '\6D' '\6E' '\6F' '\6F\6F' '\70' '\71' '\72' '\73' '\74' '\75' '\75\75' '\76' '\77' '\78' '\79' '\7A' '\63\68' '\64\68' '\6B\68' '\6E\79' '\70\68' '\73\68'; /* symbols: 'a' 'aa' 'b' 'c' 'd' 'e' 'ee' 'f' 'g' 'h' 'i' 'ii' 'j' 'k' 'l' 'm' 'n' 'o' 'oo' 'p' 'q' 'r' 's' 't' 'u' 'uu' 'v' 'w' 'x' 'y' 'z' 'ch' 'dh' 'kh' 'ny' 'ph' 'sh'; */ } </bdo></code></p> <div id="out_lower-oromo-qubee" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="om" style="list-style-type: lower-oromo-qubee; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="om" style="list-style-type: lower-oromo-qubee; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="om" style="list-style-type: lower-oromo-qubee;"><li>11</li></ol> <ol start="22" class="high" lang="om" style="list-style-type: lower-oromo-qubee;"><li>22</li></ol> <ol start="33" class="high" lang="om" style="list-style-type: lower-oromo-qubee;"><li>33</li></ol> <ol start="44" class="high" lang="om" style="list-style-type: lower-oromo-qubee;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="om" style="list-style-type: lower-oromo-qubee;"><li>111</li></ol> <ol start="222" class="high" lang="om" style="list-style-type: lower-oromo-qubee;"><li>222</li></ol> <ol start="333" class="high" lang="om" style="list-style-type: lower-oromo-qubee;"><li>333</li></ol> <ol start="444" class="high" lang="om" style="list-style-type: lower-oromo-qubee;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-oromo-qubee', 'om', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-oromo-qubee')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-oromo-qubee"><a href="#upper-oromo-qubee">upper-oromo-qubee</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-oromo-qubee { system: alphabetic; symbols: '\41' '\41\41' '\42' '\43' '\44' '\45' '\45\45' '\46' '\47' '\48' '\49' '\49\49' '\4A' '\4B' '\4C' '\4D' '\4E' '\4F' '\4F\4F' '\50' '\51' '\52' '\53' '\54' '\55' '\55\55' '\56' '\57' '\58' '\59' '\5A' '\43\48' '\44\48' '\4B\48' '\4E\59' '\50\48' '\53\48'; /* symbols: 'A' 'AA' 'B' 'C' 'D' 'E' 'EE' 'F' 'G' 'H' 'I' 'II' 'J' 'K' 'L' 'M' 'N' 'O' 'OO' 'P' 'Q' 'R' 'S' 'T' 'U' 'UU' 'V' 'W' 'X' 'Y' 'Z' 'CH' 'DH' 'KH' 'NY' 'PH' 'SH'; */ } </bdo></code></p> <div id="out_upper-oromo-qubee" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="om" style="list-style-type: upper-oromo-qubee; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="om" style="list-style-type: upper-oromo-qubee; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="om" style="list-style-type: upper-oromo-qubee;"><li>11</li></ol> <ol start="22" class="high" lang="om" style="list-style-type: upper-oromo-qubee;"><li>22</li></ol> <ol start="33" class="high" lang="om" style="list-style-type: upper-oromo-qubee;"><li>33</li></ol> <ol start="44" class="high" lang="om" style="list-style-type: upper-oromo-qubee;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="om" style="list-style-type: upper-oromo-qubee;"><li>111</li></ol> <ol start="222" class="high" lang="om" style="list-style-type: upper-oromo-qubee;"><li>222</li></ol> <ol start="333" class="high" lang="om" style="list-style-type: upper-oromo-qubee;"><li>333</li></ol> <ol start="444" class="high" lang="om" style="list-style-type: upper-oromo-qubee;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-oromo-qubee', 'om', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('parenthesized-lower-latin')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="parenthesized-lower-latin"><a href="#parenthesized-lower-latin">parenthesized-lower-latin</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style parenthesized-lower-latin { system: fixed; symbols: '\249C' '\249D' '\249E' '\249F' '\24A0' '\24A1' '\24A2' '\24A3' '\24A4' '\24A5' '\24A6' '\24A7' '\24A8' '\24A9' '\24AA' '\24AB' '\24AC' '\24AD' '\24AE' '\24AF' '\24B0' '\24B1' '\24B2' '\24B3' '\24B4' '\24B5'; /* symbols: '⒜' '⒝' '⒞' '⒟' '⒠' '⒡' '⒢' '⒣' '⒤' '⒥' '⒦' '⒧' '⒨' '⒩' '⒪' '⒫' '⒬' '⒭' '⒮' '⒯' '⒰' '⒱' '⒲' '⒳' '⒴' '⒵'; */ suffix: ' '; } </bdo></code></p> <div id="out_parenthesized-lower-latin" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: parenthesized-lower-latin; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: parenthesized-lower-latin; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: parenthesized-lower-latin;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: parenthesized-lower-latin;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: parenthesized-lower-latin;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: parenthesized-lower-latin;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: parenthesized-lower-latin;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: parenthesized-lower-latin;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: parenthesized-lower-latin;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: parenthesized-lower-latin;"><li>444</li></ol></div> </div></div> <script>addExamples('parenthesized-lower-latin', 'en', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-48"><div role="heading" class="note-title marker" id="h-note-48" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">lower-alpha</code> and <code class="kw" translate="no">upper-alpha</code> styles are defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification.</p> </aside></div> <div class="note" role="note" id="issue-container-generatedID-49"><div role="heading" class="note-title marker" id="h-note-49" aria-level="3"><span>Note</span></div><aside class=""> <p>See also the section <a href="#digit-styles">European Digits & Roman</a></p> </aside></div> </section> <section id="lepcha-styles"><div class="header-wrapper"><h2 id="x28-lepcha"><bdi class="secno">28. </bdi>Lepcha</h2><a class="self-link" href="#lepcha-styles" aria-label="Permalink for Section 28."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lepcha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lepcha"><a href="#lepcha">lepcha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lepcha { system: numeric; symbols: '\1C40' '\1C41' '\1C42' '\1C43' '\1C44' '\1C45' '\1C46' '\1C47' '\1C48' '\1C49'; /* symbols: '᱀' '᱁' '᱂' '᱃' '᱄' '᱅' '᱆' '᱇' '᱈' '᱉'; */ } </bdo></code></p> <div id="out_lepcha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="lep" style="list-style-type: lepcha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="lep" style="list-style-type: lepcha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="lep" style="list-style-type: lepcha;"><li>11</li></ol> <ol start="22" class="high" lang="lep" style="list-style-type: lepcha;"><li>22</li></ol> <ol start="33" class="high" lang="lep" style="list-style-type: lepcha;"><li>33</li></ol> <ol start="44" class="high" lang="lep" style="list-style-type: lepcha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="lep" style="list-style-type: lepcha;"><li>111</li></ol> <ol start="222" class="high" lang="lep" style="list-style-type: lepcha;"><li>222</li></ol> <ol start="333" class="high" lang="lep" style="list-style-type: lepcha;"><li>333</li></ol> <ol start="444" class="high" lang="lep" style="list-style-type: lepcha;"><li>444</li></ol></div> </div></div> <script>addExamples('lepcha', 'lep', '')</script> </div> </section> <section id="limbu-styles"><div class="header-wrapper"><h2 id="x29-limbu"><bdi class="secno">29. </bdi>Limbu</h2><a class="self-link" href="#limbu-styles" aria-label="Permalink for Section 29."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('limbu')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="limbu"><a href="#limbu">limbu</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style limbu { system: numeric; symbols: \1946 \1947 \1948 \1949 \194A \194B \194C \194D \194E \194F ; /* symbols: ᥆ ᥇ ᥈ ᥉ ᥊ ᥋ ᥌ ᥍ ᥎ ᥏; */ } </bdo></code></p> <div id="out_limbu" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="lif" style="list-style-type: limbu; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="lif" style="list-style-type: limbu; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="lif" style="list-style-type: limbu;"><li>11</li></ol> <ol start="22" class="high" lang="lif" style="list-style-type: limbu;"><li>22</li></ol> <ol start="33" class="high" lang="lif" style="list-style-type: limbu;"><li>33</li></ol> <ol start="44" class="high" lang="lif" style="list-style-type: limbu;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="lif" style="list-style-type: limbu;"><li>111</li></ol> <ol start="222" class="high" lang="lif" style="list-style-type: limbu;"><li>222</li></ol> <ol start="333" class="high" lang="lif" style="list-style-type: limbu;"><li>333</li></ol> <ol start="444" class="high" lang="lif" style="list-style-type: limbu;"><li>444</li></ol></div> </div></div> <script>addExamples('limbu', 'lif', '')</script> </div> </section> <section id="malayalam-styles"><div class="header-wrapper"><h2 id="x30-malayalam"><bdi class="secno">30. </bdi>Malayalam</h2><a class="self-link" href="#malayalam-styles" aria-label="Permalink for Section 30."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('malayalam')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="malayalam"><a href="#malayalam">malayalam</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style malayalam { system: numeric; symbols: '\D66' '\D67' '\D68' '\D69' '\D6A' '\D6B' '\D6C' '\D6D' '\D6E' '\D6F'; /* symbols: '൦' '൧' '൨' '൩' '൪' '൫' '൬' '൭' '൮' '൯'; */ } </bdo></code></p> <div id="out_malayalam" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ml" style="list-style-type: malayalam; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ml" style="list-style-type: malayalam; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ml" style="list-style-type: malayalam;"><li>11</li></ol> <ol start="22" class="high" lang="ml" style="list-style-type: malayalam;"><li>22</li></ol> <ol start="33" class="high" lang="ml" style="list-style-type: malayalam;"><li>33</li></ol> <ol start="44" class="high" lang="ml" style="list-style-type: malayalam;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ml" style="list-style-type: malayalam;"><li>111</li></ol> <ol start="222" class="high" lang="ml" style="list-style-type: malayalam;"><li>222</li></ol> <ol start="333" class="high" lang="ml" style="list-style-type: malayalam;"><li>333</li></ol> <ol start="444" class="high" lang="ml" style="list-style-type: malayalam;"><li>444</li></ol></div> </div></div> <script>addExamples('malayalam', 'ml', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-50"><div role="heading" class="note-title marker" id="h-note-50" aria-level="3"><span>Note</span></div><p class="">This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">malayalam</a></code> style.</p></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('malayalam-alpha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="malayalam-alpha"><a href="#malayalam-alpha">malayalam-alpha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style malayalam-alpha { system: alphabetic; symbols: '\D15' '\D7F' '\D16' '\D17' '\D18' '\D19' '\D1A''\D1B' '\D1C' '\D1D' '\D1E' '\D1F' '\D20' '\D21' '\D22' '\D23' '\D7A' '\D24' '\D25' '\D26' '\D27' '\D28' '\D7B' '\D2A' '\D2B' '\D2C' '\D2D' '\D2E' '\D2F' '\D30' '\D7C' '\D32' '\D7D' '\D35' '\D36' '\D37' '\D38' '\D39' '\D33' '\D7E' '\D34' '\D31' ; /* symbols: 'ക' 'ൿ ''ഖ' 'ഗ' 'ഘ' 'ങ' 'ച' 'ഛ' 'ജ' 'ഝ' 'ഞ' ട' 'ഠ' 'ഡ' 'ഢ' 'ണ' 'ൺ' 'ത' 'ഥ' 'ദ' 'ധ' 'ന' 'ൻ' 'പ' 'ഫ' 'ബ' 'ഭ' 'മ' 'യ' 'ര' 'ർ' 'ല' 'ൽ' 'വ' 'ശ' 'ഷ' 'സ' 'ഹ' 'ള' 'ൾ' 'ഴ' 'റ' ; */ prefix: '('; suffix: ') '; } </bdo></code></p> <div id="out_malayalam-alpha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ml" style="list-style-type: malayalam-alpha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ml" style="list-style-type: malayalam-alpha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ml" style="list-style-type: malayalam-alpha;"><li>11</li></ol> <ol start="22" class="high" lang="ml" style="list-style-type: malayalam-alpha;"><li>22</li></ol> <ol start="33" class="high" lang="ml" style="list-style-type: malayalam-alpha;"><li>33</li></ol> <ol start="44" class="high" lang="ml" style="list-style-type: malayalam-alpha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ml" style="list-style-type: malayalam-alpha;"><li>111</li></ol> <ol start="222" class="high" lang="ml" style="list-style-type: malayalam-alpha;"><li>222</li></ol> <ol start="333" class="high" lang="ml" style="list-style-type: malayalam-alpha;"><li>333</li></ol> <ol start="444" class="high" lang="ml" style="list-style-type: malayalam-alpha;"><li>444</li></ol></div> </div></div> <script>addExamples('malayalam-alpha', 'ml', '')</script> </div> </section> <section id="meetei-styles"><div class="header-wrapper"><h2 id="x31-meetei"><bdi class="secno">31. </bdi>Meetei</h2><a class="self-link" href="#meetei-styles" aria-label="Permalink for Section 31."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('meetei')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="meetei"><a href="#meetei">meetei</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style meetei { system: numeric; symbols: '\ABF0' '\ABF1' '\ABF2' '\ABF3' '\ABF4' '\ABF5' '\ABF6' '\ABF7' '\ABF8' '\ABF9'; /* symbols: '꯰' '꯱' '꯲' '꯳' '꯴' '꯵' '꯶' '꯷' '꯸' '꯹'; */ suffix: ') '; } </bdo></code></p> <div id="out_meetei" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="mni" style="list-style-type: meetei; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="mni" style="list-style-type: meetei; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="mni" style="list-style-type: meetei;"><li>11</li></ol> <ol start="22" class="high" lang="mni" style="list-style-type: meetei;"><li>22</li></ol> <ol start="33" class="high" lang="mni" style="list-style-type: meetei;"><li>33</li></ol> <ol start="44" class="high" lang="mni" style="list-style-type: meetei;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="mni" style="list-style-type: meetei;"><li>111</li></ol> <ol start="222" class="high" lang="mni" style="list-style-type: meetei;"><li>222</li></ol> <ol start="333" class="high" lang="mni" style="list-style-type: meetei;"><li>333</li></ol> <ol start="444" class="high" lang="mni" style="list-style-type: meetei;"><li>444</li></ol></div> </div></div> <script>addExamples('meetei', 'mni', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('manipuri')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="manipuri"><a href="#manipuri">manipuri</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style manipuri { system: alphabetic; symbols: '\ABC0' '\ABC1' '\ABC2' '\ABC3' '\ABC4' '\ABC5' '\ABC6' '\ABC7' '\ABC8' '\ABC9' '\ABCA' '\ABCB' '\ABCC' '\ABCD' '\ABCE' '\ABCF' '\ABD0' '\ABD1' '\ABD2' '\ABD3' '\ABD4' '\ABD5' '\ABD6' '\ABD7' '\ABD8' '\ABD9' '\ABDA' ; /* symbols: 'ꯀ' 'ꯁ' 'ꯂ' 'ꯃ' 'ꯄ' 'ꯅ' 'ꯆ' 'ꯇ' 'ꯈ' 'ꯉ' 'ꯊ' 'ꯋ' 'ꯌ' 'ꯍ' 'ꯎ' 'ꯏ' 'ꯐ' 'ꯑ' 'ꯒ' 'ꯓ' 'ꯔ' 'ꯕ' 'ꯖ' 'ꯗ' 'ꯘ' 'ꯙ' 'ꯚ'; */ } </bdo></code></p> <div id="out_manipuri" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="mni" style="list-style-type: manipuri; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="mni" style="list-style-type: manipuri; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="mni" style="list-style-type: manipuri;"><li>11</li></ol> <ol start="22" class="high" lang="mni" style="list-style-type: manipuri;"><li>22</li></ol> <ol start="33" class="high" lang="mni" style="list-style-type: manipuri;"><li>33</li></ol> <ol start="44" class="high" lang="mni" style="list-style-type: manipuri;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="mni" style="list-style-type: manipuri;"><li>111</li></ol> <ol start="222" class="high" lang="mni" style="list-style-type: manipuri;"><li>222</li></ol> <ol start="333" class="high" lang="mni" style="list-style-type: manipuri;"><li>333</li></ol> <ol start="444" class="high" lang="mni" style="list-style-type: manipuri;"><li>444</li></ol></div> </div></div> <script>addExamples('manipuri', 'mni', '')</script> </div> </section> <section id="mongolian-styles"><div class="header-wrapper"><h2 id="x32-mongolian"><bdi class="secno">32. </bdi>Mongolian</h2><a class="self-link" href="#mongolian-styles" aria-label="Permalink for Section 32."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('mongolian')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="mongolian"><a href="#mongolian">mongolian</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style mongolian { system: numeric; symbols: '\1810' '\1811' '\1812' '\1813' '\1814' '\1815' '\1816' '\1817' '\1818' '\1819'; /* symbols: '᠐' '᠑' '᠒' '᠓' '᠔' '᠕' '᠖' '᠗' '᠘' '᠙'; */ } </bdo></code></p> <div id="out_mongolian" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="mn" style="list-style-type: mongolian; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="mn" style="list-style-type: mongolian; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="mn" style="list-style-type: mongolian;"><li>11</li></ol> <ol start="22" class="high" lang="mn" style="list-style-type: mongolian;"><li>22</li></ol> <ol start="33" class="high" lang="mn" style="list-style-type: mongolian;"><li>33</li></ol> <ol start="44" class="high" lang="mn" style="list-style-type: mongolian;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="mn" style="list-style-type: mongolian;"><li>111</li></ol> <ol start="222" class="high" lang="mn" style="list-style-type: mongolian;"><li>222</li></ol> <ol start="333" class="high" lang="mn" style="list-style-type: mongolian;"><li>333</li></ol> <ol start="444" class="high" lang="mn" style="list-style-type: mongolian;"><li>444</li></ol></div> </div></div> <script>addExamples('mongolian', 'mn', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-51"><div role="heading" class="note-title marker" id="h-note-51" aria-level="3"><span>Note</span></div><aside class=""> <p>This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">mongolian</a></code> style.</p> </aside></div> </section> <section id="mro-styles"><div class="header-wrapper"><h2 id="x33-mro"><bdi class="secno">33. </bdi>Mro</h2><a class="self-link" href="#mro-styles" aria-label="Permalink for Section 33."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('mro')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="mro"><a href="#mro">mro</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style mro { system: numeric; symbols: \016A60 \016A61 \016A62 \016A63 \016A64 \016A65 \016A66 \016A67 \016A68 \016A69 ; /* symbols: 𖩠 𖩡 𖩢 𖩣 𖩤 𖩥 𖩦 𖩧 𖩨 𖩩; */ } </bdo></code></p> <div id="out_mro" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="mro" style="list-style-type: mro; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="mro" style="list-style-type: mro; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="mro" style="list-style-type: mro;"><li>11</li></ol> <ol start="22" class="high" lang="mro" style="list-style-type: mro;"><li>22</li></ol> <ol start="33" class="high" lang="mro" style="list-style-type: mro;"><li>33</li></ol> <ol start="44" class="high" lang="mro" style="list-style-type: mro;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="mro" style="list-style-type: mro;"><li>111</li></ol> <ol start="222" class="high" lang="mro" style="list-style-type: mro;"><li>222</li></ol> <ol start="333" class="high" lang="mro" style="list-style-type: mro;"><li>333</li></ol> <ol start="444" class="high" lang="mro" style="list-style-type: mro;"><li>444</li></ol></div> </div></div> <script>addExamples('mro', 'mro', '')</script> </div> </section> <section id="myanmar-styles"><div class="header-wrapper"><h2 id="x34-myanmar-burmese"><bdi class="secno">34. </bdi>Myanmar (Burmese)</h2><a class="self-link" href="#myanmar-styles" aria-label="Permalink for Section 34."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('myanmar')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="myanmar"><a href="#myanmar">myanmar</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style myanmar { system: numeric; symbols: '\1040' '\1041' '\1042' '\1043' '\1044' '\1045' '\1046' '\1047' '\1048' '\1049'; /* symbols: '၀' '၁' '၂' '၃' '၄' '၅' '၆' '၇' '၈' '၉'; */ prefix: '('; suffix: ') '; } </bdo></code></p> <div id="out_myanmar" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="my" style="list-style-type: myanmar; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="my" style="list-style-type: myanmar; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="my" style="list-style-type: myanmar;"><li>11</li></ol> <ol start="22" class="high" lang="my" style="list-style-type: myanmar;"><li>22</li></ol> <ol start="33" class="high" lang="my" style="list-style-type: myanmar;"><li>33</li></ol> <ol start="44" class="high" lang="my" style="list-style-type: myanmar;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="my" style="list-style-type: myanmar;"><li>111</li></ol> <ol start="222" class="high" lang="my" style="list-style-type: myanmar;"><li>222</li></ol> <ol start="333" class="high" lang="my" style="list-style-type: myanmar;"><li>333</li></ol> <ol start="444" class="high" lang="my" style="list-style-type: myanmar;"><li>444</li></ol></div> </div></div> <script>addExamples('myanmar', 'my', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('shan')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="shan"><a href="#shan">shan</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style shan { system: numeric; symbols: '\1090' '\1091' '\1092' '\1093' '\1094' '\1095' '\1096' '\1097' '\1098' '\1099'; /* symbols: '႐' '႑' '႒' '႓' '႔' '႕' '႖' '႗' '႘' '႙'; */ prefix: '('; suffix: ') '; } </bdo></code></p> <div id="out_shan" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="shn" style="list-style-type: shan; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="shn" style="list-style-type: shan; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="shn" style="list-style-type: shan;"><li>11</li></ol> <ol start="22" class="high" lang="shn" style="list-style-type: shan;"><li>22</li></ol> <ol start="33" class="high" lang="shn" style="list-style-type: shan;"><li>33</li></ol> <ol start="44" class="high" lang="shn" style="list-style-type: shan;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="shn" style="list-style-type: shan;"><li>111</li></ol> <ol start="222" class="high" lang="shn" style="list-style-type: shan;"><li>222</li></ol> <ol start="333" class="high" lang="shn" style="list-style-type: shan;"><li>333</li></ol> <ol start="444" class="high" lang="shn" style="list-style-type: shan;"><li>444</li></ol></div> </div></div> <script>addExamples('shan', 'shn', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-52"><div role="heading" class="note-title marker" id="h-note-52" aria-level="3"><span>Note</span></div><aside class=""> <p>When supported by browsers natively, the <code class="kw" translate="no">myanmar</code> counters are followed by period+space, however it is more common for counters in lists to appear in parentheses, as shown here. Both <code class="kw" translate="no">myanmar</code> and <code class="kw" translate="no">shan</code> styles may also sometimes use <span class="codepoint" translate="no"><span lang="my">။</span> [<span class="uname">U+104B MYANMAR SIGN SECTION</span>]</span> as a suffix, instead of surrounding the counter with parentheses</p> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br>Use one of the following lines to change the default styling:</p> <ol> <li><code><bdo dir="ltr"> prefix: ''; suffix: ') '; </bdo></code></li> <li><code><bdo dir="ltr"> prefix: ''; suffix: '။ '; </bdo></code></li> </ol> </aside></div> <div class="note" role="note" id="issue-container-generatedID-53"><div role="heading" class="note-title marker" id="h-note-53" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">myanmar</code> style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification, but with period+space as the default suffix (see just above). Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">myanmar</a></code> style.</p> </aside></div> </section> <section id="nko-styles"><div class="header-wrapper"><h2 id="x35-n-ko"><bdi class="secno">35. </bdi>N’Ko</h2><a class="self-link" href="#nko-styles" aria-label="Permalink for Section 35."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('nko-cardinal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="nko-cardinal"><a href="#nko-cardinal">nko-cardinal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style nko-cardinal { system: numeric; symbols: \07C1 \07C2 \07C3 \07C4 \07C5 \07C6 \07C7 \07C8 \07C9 \07C0; /* symbols: ߁ ߂ ߃ ߄ ߅ ߆ ߇ ߈ ߉ ߀ */ suffix: ' - '; } </bdo></code></p> <div id="out_nko-cardinal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;" dir="rtl"> <ol lang="nqo" style="list-style-type: nko-cardinal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="nqo" style="list-style-type: nko-cardinal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="nqo" style="list-style-type: nko-cardinal;"><li>11</li></ol> <ol start="22" class="high" lang="nqo" style="list-style-type: nko-cardinal;"><li>22</li></ol> <ol start="33" class="high" lang="nqo" style="list-style-type: nko-cardinal;"><li>33</li></ol> <ol start="44" class="high" lang="nqo" style="list-style-type: nko-cardinal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="nqo" style="list-style-type: nko-cardinal;"><li>111</li></ol> <ol start="222" class="high" lang="nqo" style="list-style-type: nko-cardinal;"><li>222</li></ol> <ol start="333" class="high" lang="nqo" style="list-style-type: nko-cardinal;"><li>333</li></ol> <ol start="444" class="high" lang="nqo" style="list-style-type: nko-cardinal;"><li>444</li></ol></div> </div></div> <script>addExamples('nko-cardinal', 'nqo', 'rtl')</script> </div> <div class="note" role="note" id="issue-container-generatedID-54"><div role="heading" class="note-title marker" id="h-note-54" aria-level="3"><span>Note</span></div><aside class=""> <p>N’Ko often uses another style based on ordinal numbers, but it is not yet clear how to write a template for that, since it involves a somewhat complex use of diacritics.</p> </aside></div> </section> <section id="nag-mundari-styles"><div class="header-wrapper"><h2 id="x36-nag-mundari"><bdi class="secno">36. </bdi>Nag Mundari</h2><a class="self-link" href="#nag-mundari-styles" aria-label="Permalink for Section 36."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('nag-mundari')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="nag-mundari"><a href="#nag-mundari">nag-mundari</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style nag-mundari { system: numeric; symbols: '\01E4F0' '\01E4F1' '\01E4F2' '\01E4F3' '\01E4F4' '\01E4F5' '\01E4F6' '\01E4F7' '\01E4F8' '\01E4F9' ; /* symbols: 𞓰 𞓱 𞓲 𞓳 𞓴 𞓵 𞓶 𞓷 𞓸 𞓹; */ } </bdo></code></p> <div id="out_nag-mundari" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="unr" style="list-style-type: nag-mundari; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="unr" style="list-style-type: nag-mundari; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="unr" style="list-style-type: nag-mundari;"><li>11</li></ol> <ol start="22" class="high" lang="unr" style="list-style-type: nag-mundari;"><li>22</li></ol> <ol start="33" class="high" lang="unr" style="list-style-type: nag-mundari;"><li>33</li></ol> <ol start="44" class="high" lang="unr" style="list-style-type: nag-mundari;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="unr" style="list-style-type: nag-mundari;"><li>111</li></ol> <ol start="222" class="high" lang="unr" style="list-style-type: nag-mundari;"><li>222</li></ol> <ol start="333" class="high" lang="unr" style="list-style-type: nag-mundari;"><li>333</li></ol> <ol start="444" class="high" lang="unr" style="list-style-type: nag-mundari;"><li>444</li></ol></div> </div></div> <script>addExamples('nag-mundari', 'unr', '')</script> </div> </section> <section id="newa-styles"><div class="header-wrapper"><h2 id="x37-newa"><bdi class="secno">37. </bdi>Newa</h2><a class="self-link" href="#newa-styles" aria-label="Permalink for Section 37."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('newa')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="newa"><a href="#newa">newa</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style newa { system: numeric; symbols: '\011450' '\011451' '\011452' '\011453' '\011454' '\011455' '\011456' '\011457' '\011458' '\011459'; /* symbols: 𑑐 𑑑 𑑒 𑑓 𑑔 𑑕 𑑖 𑑗 𑑘 𑑙; */ } </bdo></code></p> <div id="out_newa" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="new" style="list-style-type: newa; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="new" style="list-style-type: newa; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="new" style="list-style-type: newa;"><li>11</li></ol> <ol start="22" class="high" lang="new" style="list-style-type: newa;"><li>22</li></ol> <ol start="33" class="high" lang="new" style="list-style-type: newa;"><li>33</li></ol> <ol start="44" class="high" lang="new" style="list-style-type: newa;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="new" style="list-style-type: newa;"><li>111</li></ol> <ol start="222" class="high" lang="new" style="list-style-type: newa;"><li>222</li></ol> <ol start="333" class="high" lang="new" style="list-style-type: newa;"><li>333</li></ol> <ol start="444" class="high" lang="new" style="list-style-type: newa;"><li>444</li></ol></div> </div></div> <script>addExamples('newa', 'new', '')</script> </div> </section> <section id="ol-chiki-styles"><div class="header-wrapper"><h2 id="x38-ol-chiki"><bdi class="secno">38. </bdi>Ol Chiki</h2><a class="self-link" href="#ol-chiki-styles" aria-label="Permalink for Section 38."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('ol-chiki')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="ol-chiki"><a href="#ol-chiki">ol-chiki</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style ol-chiki { system: numeric; symbols: '\1C50' '\1C51' '\1C52' '\1C53' '\1C54' '\1C55' '\1C56' '\1C57' '\1C58' '\1C59'; /* symbols: '᱐' '᱑' '᱒' '᱓' '᱔' '᱕' '᱖' '᱗' '᱘' '᱙'; */ suffix: '. '; } </bdo></code></p> <div id="out_ol-chiki" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="sat" style="list-style-type: ol-chiki; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="sat" style="list-style-type: ol-chiki; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="sat" style="list-style-type: ol-chiki;"><li>11</li></ol> <ol start="22" class="high" lang="sat" style="list-style-type: ol-chiki;"><li>22</li></ol> <ol start="33" class="high" lang="sat" style="list-style-type: ol-chiki;"><li>33</li></ol> <ol start="44" class="high" lang="sat" style="list-style-type: ol-chiki;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="sat" style="list-style-type: ol-chiki;"><li>111</li></ol> <ol start="222" class="high" lang="sat" style="list-style-type: ol-chiki;"><li>222</li></ol> <ol start="333" class="high" lang="sat" style="list-style-type: ol-chiki;"><li>333</li></ol> <ol start="444" class="high" lang="sat" style="list-style-type: ol-chiki;"><li>444</li></ol></div> </div></div> <script>addExamples('ol-chiki', 'sat', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-55"><div role="heading" class="note-title marker" id="h-note-55" aria-level="3"><span>Note</span></div><aside class=""> <p>The period+space suffix is common for the numeric style, however counters are sometimes followed by just a space, or enclosed in parentheses</p> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style ol-chiki-space { system: extends ol-chiki; prefix: ""; suffix: " "; } </bdo></code></li> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style ol-chiki-dbl-paren { system: extends ol-chiki; prefix: "("; suffix: ") "; } </bdo></code></li> </ol> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('santali')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="santali"><a href="#santali">santali</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style santali { system: alphabetic; symbols: '\1C5A' '\1C5B' '\1C5C' '\1C5D' '\1C5E' '\1C5F' '\1C60' '\1C61' '\1C62' '\1C63' '\1C64' '\1C65' '\1C66' '\1C67' '\1C68' '\1C69' '\1C6A' '\1C6B' '\1C6C' '\1C6D' '\1C6E' '\1C6F' '\1C70' '\1C71' '\1C72' '\1C73' '\1C74' '\1C75' '\1C76' '\1C77' ; /* symbols: 'ᱚ' 'ᱛ' 'ᱜ' 'ᱝ' 'ᱞ' 'ᱟ' 'ᱠ' 'ᱡ' 'ᱢ' 'ᱣ' 'ᱤ' 'ᱥ' 'ᱦ' 'ᱧ' 'ᱨ' 'ᱩ' 'ᱪ' 'ᱫ' 'ᱬ' 'ᱭ' 'ᱮ' 'ᱯ' 'ᱰ' 'ᱱ' 'ᱲ' 'ᱳ' 'ᱴ' 'ᱵ' 'ᱶ' 'ᱷ' */ prefix: '('; suffix: ') '; } </bdo></code></p> <div id="out_santali" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="sat" style="list-style-type: santali; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="sat" style="list-style-type: santali; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="sat" style="list-style-type: santali;"><li>11</li></ol> <ol start="22" class="high" lang="sat" style="list-style-type: santali;"><li>22</li></ol> <ol start="33" class="high" lang="sat" style="list-style-type: santali;"><li>33</li></ol> <ol start="44" class="high" lang="sat" style="list-style-type: santali;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="sat" style="list-style-type: santali;"><li>111</li></ol> <ol start="222" class="high" lang="sat" style="list-style-type: santali;"><li>222</li></ol> <ol start="333" class="high" lang="sat" style="list-style-type: santali;"><li>333</li></ol> <ol start="444" class="high" lang="sat" style="list-style-type: santali;"><li>444</li></ol></div> </div></div> <script>addExamples('santali', 'sat', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-56"><div role="heading" class="note-title marker" id="h-note-56" aria-level="3"><span>Note</span></div><aside class=""> <p> Once the range is large enough to require 2-letter markers (eg. <span lang="sat">ᱚᱚ</span>), then normally the only affixes used are surrounding parentheses. The other affixes are only used if the length doesn't exceed the number of letters available.</p> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style santali-paren { system: extends santali; prefix: ""; suffix: ") "; } </bdo></code></li> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style santali-oblique { system: extends santali; prefix: ""; suffix: "/ "; } </bdo></code></li> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style santali-dbl-paren { system: extends santali; prefix: "("; suffix: ") "; } </bdo></code></li> </ol> </aside></div> </section> <section id="oriya-styles"><div class="header-wrapper"><h2 id="x39-oriya"><bdi class="secno">39. </bdi>Oriya</h2><a class="self-link" href="#oriya-styles" aria-label="Permalink for Section 39."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('oriya')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="oriya"><a href="#oriya">oriya</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style oriya { system: numeric; symbols: '\B66' '\B67' '\B68' '\B69' '\B6A' '\B6B' '\B6C' '\B6D' '\B6E' '\B6F'; /* symbols: '୦' '୧' '୨' '୩' '୪' '୫' '୬' '୭' '୮' '୯'; */ } </bdo></code></p> <div id="out_oriya" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="or" style="list-style-type: oriya; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="or" style="list-style-type: oriya; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="or" style="list-style-type: oriya;"><li>11</li></ol> <ol start="22" class="high" lang="or" style="list-style-type: oriya;"><li>22</li></ol> <ol start="33" class="high" lang="or" style="list-style-type: oriya;"><li>33</li></ol> <ol start="44" class="high" lang="or" style="list-style-type: oriya;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="or" style="list-style-type: oriya;"><li>111</li></ol> <ol start="222" class="high" lang="or" style="list-style-type: oriya;"><li>222</li></ol> <ol start="333" class="high" lang="or" style="list-style-type: oriya;"><li>333</li></ol> <ol start="444" class="high" lang="or" style="list-style-type: oriya;"><li>444</li></ol></div> </div></div> <script>addExamples('oriya', 'or', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-57"><div role="heading" class="note-title marker" id="h-note-57" aria-level="3"><span>Note</span></div><aside class=""> <p>This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">oriya</a></code> style.</p> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('odia')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="odia"><a href="#odia">odia</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style odia { system: alphabetic; symbols: '\0B15' '\0B16' '\0B17' '\0B18' '\0B19' '\0B1A' '\0B1B' '\0B1C' '\0B1D' '\0B1E' '\0B1F' '\0B20' '\0B21' '\0B21\0B3C' '\0B22' '\0B22\0B3C' '\0B23' '\0B24' '\0B25' '\0B26' '\0B27' '\0B28' '\0B2A' '\0B2B' '\0B2C' '\0B2D' '\0B2E' '\0B2F' '\0B5F' '\0B30' '\0B32' '\0B33' '\0B71' '\0B36' '\0B37' '\0B38' '\0B39' ; /* symbols: 'କ' 'ଖ' 'ଗ' 'ଘ' 'ଙ' 'ଚ' 'ଛ' 'ଜ' 'ଝ' 'ଞ' 'ଟ' 'ଠ' 'ଡ' 'ଡ଼' 'ଢ' 'ଢ଼' 'ଣ' 'ତ' 'ଥ' 'ଦ' 'ଧ' 'ନ' 'ପ' 'ଫ' 'ବ' 'ଭ' 'ମ' 'ଯ' 'ୟ' 'ର' 'ଲ' 'ଳ' 'ୱ' 'ଶ' 'ଷ' 'ସ' 'ହ' ; */ prefix: '('; suffix: ') '; } </bdo></code></p> <div id="out_odia" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="or" style="list-style-type: odia; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="or" style="list-style-type: odia; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="or" style="list-style-type: odia;"><li>11</li></ol> <ol start="22" class="high" lang="or" style="list-style-type: odia;"><li>22</li></ol> <ol start="33" class="high" lang="or" style="list-style-type: odia;"><li>33</li></ol> <ol start="44" class="high" lang="or" style="list-style-type: odia;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="or" style="list-style-type: odia;"><li>111</li></ol> <ol start="222" class="high" lang="or" style="list-style-type: odia;"><li>222</li></ol> <ol start="333" class="high" lang="or" style="list-style-type: odia;"><li>333</li></ol> <ol start="444" class="high" lang="or" style="list-style-type: odia;"><li>444</li></ol></div> </div></div> <script>addExamples('odia', 'or', '')</script> </div> </section> <section id="sundanese-styles"><div class="header-wrapper"><h2 id="x40-sundanese"><bdi class="secno">40. </bdi>Sundanese</h2><a class="self-link" href="#sundanese-styles" aria-label="Permalink for Section 40."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('sundanese')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="sundanese"><a href="#sundanese">sundanese</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style sundanese { system: numeric; symbols: '\1BB0' '\1BB1' '\1BB2' '\1BB3' '\1BB4' '\1BB5' '\1BB6' '\1BB7' '\1BB8' '\1BB9'; /* symbols: ᮰ ᮱ ᮲ ᮳ ᮴ ᮵ ᮶ ᮷ ᮸ ᮹; */ } </bdo></code></p> <div id="out_sundanese" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="su" style="list-style-type: sundanese; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="su" style="list-style-type: sundanese; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="su" style="list-style-type: sundanese;"><li>11</li></ol> <ol start="22" class="high" lang="su" style="list-style-type: sundanese;"><li>22</li></ol> <ol start="33" class="high" lang="su" style="list-style-type: sundanese;"><li>33</li></ol> <ol start="44" class="high" lang="su" style="list-style-type: sundanese;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="su" style="list-style-type: sundanese;"><li>111</li></ol> <ol start="222" class="high" lang="su" style="list-style-type: sundanese;"><li>222</li></ol> <ol start="333" class="high" lang="su" style="list-style-type: sundanese;"><li>333</li></ol> <ol start="444" class="high" lang="su" style="list-style-type: sundanese;"><li>444</li></ol></div> </div></div> <script>addExamples('sundanese', 'su', '')</script> </div> </section> <section id="tailue-styles"><div class="header-wrapper"><h2 id="x41-tai-lu"><bdi class="secno">41. </bdi>Tai Lü</h2><a class="self-link" href="#tailue-styles" aria-label="Permalink for Section 41."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('tai-lue')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="tai-lue"><a href="#tai-lue">tai-lue</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style tai-lue { system: numeric; symbols: '\19D0' '\19D1' '\19D2' '\19D3' '\19D4' '\19D5' '\19D6' '\19D7' '\19D8' '\19D9'; /* symbols: ᧐ ᧑ ᧒ ᧓ ᧔ ᧕ ᧖ ᧗ ᧘ ᧙; */ } </bdo></code></p> <div id="out_tai-lue" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="khb" style="list-style-type: tai-lue; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="khb" style="list-style-type: tai-lue; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="khb" style="list-style-type: tai-lue;"><li>11</li></ol> <ol start="22" class="high" lang="khb" style="list-style-type: tai-lue;"><li>22</li></ol> <ol start="33" class="high" lang="khb" style="list-style-type: tai-lue;"><li>33</li></ol> <ol start="44" class="high" lang="khb" style="list-style-type: tai-lue;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="khb" style="list-style-type: tai-lue;"><li>111</li></ol> <ol start="222" class="high" lang="khb" style="list-style-type: tai-lue;"><li>222</li></ol> <ol start="333" class="high" lang="khb" style="list-style-type: tai-lue;"><li>333</li></ol> <ol start="444" class="high" lang="khb" style="list-style-type: tai-lue;"><li>444</li></ol></div> </div></div> <script>addExamples('tai-lue', 'khb', '')</script> </div> </section> <section id="tamil-styles"><div class="header-wrapper"><h2 id="x42-tamil"><bdi class="secno">42. </bdi>Tamil</h2><a class="self-link" href="#tamil-styles" aria-label="Permalink for Section 42."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('ancient-tamil')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="ancient-tamil"><a href="#ancient-tamil">ancient-tamil</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style ancient-tamil { system: additive; range: 1 9999; additive-symbols: 9000 '\BEF\BF2', 8000 '\BEE\BF2', 7000 '\BED\BF2', 6000 '\BEC\BF2', 5000 '\BEB\BF2', 4000 '\BEA\BF2', 3000 '\BE9\BF2', 2000 '\BE8\BF2', 1000 '\BF2', 900 '\BEF\BF1', 800 '\BEE\BF1', 700 '\BED\BF1', 600 '\BEC\BF1', 500 '\BEB\BF1', 400 '\BEA\BF1', 300 '\BE9\BF1', 200 '\BE8\BF1', 100 '\BF1', 90 '\BEF\BF0', 80 '\BEE\BF0', 70 '\BED\BF0', 60 '\BEC\BF0', 50 '\BEB\BF0', 40 '\BEA\BF0', 30 '\BE9\BF0', 20 '\BE8\BF0', 10 '\BF0', 9 '\BEF', 8 '\BEE', 7 '\BED', 6 '\BEC', 5 '\BEB', 4 '\BEA', 3 '\BE9', 2 '\BE8', 1 '\BE7'; /* additive-symbols: 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 '௧'; */ } </bdo></code></p> <div id="out_ancient-tamil" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ta" style="list-style-type: ancient-tamil; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ta" style="list-style-type: ancient-tamil; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ta" style="list-style-type: ancient-tamil;"><li>11</li></ol> <ol start="22" class="high" lang="ta" style="list-style-type: ancient-tamil;"><li>22</li></ol> <ol start="33" class="high" lang="ta" style="list-style-type: ancient-tamil;"><li>33</li></ol> <ol start="44" class="high" lang="ta" style="list-style-type: ancient-tamil;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ta" style="list-style-type: ancient-tamil;"><li>111</li></ol> <ol start="222" class="high" lang="ta" style="list-style-type: ancient-tamil;"><li>222</li></ol> <ol start="333" class="high" lang="ta" style="list-style-type: ancient-tamil;"><li>333</li></ol> <ol start="444" class="high" lang="ta" style="list-style-type: ancient-tamil;"><li>444</li></ol></div> </div></div> <script>addExamples('ancient-tamil', 'ta', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('tamil')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="tamil"><a href="#tamil">tamil</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style tamil { system: numeric; symbols: '\BE6' '\BE7' '\BE8' '\BE9' '\BEA' '\BEB' '\BEC' '\BED' '\BEE' '\BEF'; /* symbols: '௦' '௧' '௨' '௩' '௪' '௫' '௬' '௭' '௮' '௯'; */ } </bdo></code></p> <div id="out_tamil" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="ta" style="list-style-type: tamil; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="ta" style="list-style-type: tamil; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="ta" style="list-style-type: tamil;"><li>11</li></ol> <ol start="22" class="high" lang="ta" style="list-style-type: tamil;"><li>22</li></ol> <ol start="33" class="high" lang="ta" style="list-style-type: tamil;"><li>33</li></ol> <ol start="44" class="high" lang="ta" style="list-style-type: tamil;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="ta" style="list-style-type: tamil;"><li>111</li></ol> <ol start="222" class="high" lang="ta" style="list-style-type: tamil;"><li>222</li></ol> <ol start="333" class="high" lang="ta" style="list-style-type: tamil;"><li>333</li></ol> <ol start="444" class="high" lang="ta" style="list-style-type: tamil;"><li>444</li></ol></div> </div></div> <script>addExamples('tamil', 'ta', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-58"><div role="heading" class="note-title marker" id="h-note-58" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">tamil</code> style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">tamil</a></code> style.</p> </aside></div> </section> <section id="telugu-styles"><div class="header-wrapper"><h2 id="x43-telugu"><bdi class="secno">43. </bdi>Telugu</h2><a class="self-link" href="#telugu-styles" aria-label="Permalink for Section 43."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('telugu')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="telugu"><a href="#telugu">telugu</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style telugu { system: numeric; symbols: '\C66' '\C67' '\C68' '\C69' '\C6A' '\C6B' '\C6C' '\C6D' '\C6E' '\C6F'; /* symbols: '౦' '౧' '౨' '౩' '౪' '౫' '౬' '౭' '౮' '౯'; */ } </bdo></code></p> <div id="out_telugu" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="te" style="list-style-type: telugu; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="te" style="list-style-type: telugu; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="te" style="list-style-type: telugu;"><li>11</li></ol> <ol start="22" class="high" lang="te" style="list-style-type: telugu;"><li>22</li></ol> <ol start="33" class="high" lang="te" style="list-style-type: telugu;"><li>33</li></ol> <ol start="44" class="high" lang="te" style="list-style-type: telugu;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="te" style="list-style-type: telugu;"><li>111</li></ol> <ol start="222" class="high" lang="te" style="list-style-type: telugu;"><li>222</li></ol> <ol start="333" class="high" lang="te" style="list-style-type: telugu;"><li>333</li></ol> <ol start="444" class="high" lang="te" style="list-style-type: telugu;"><li>444</li></ol></div> </div></div> <script>addExamples('telugu', 'te', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-59"><div role="heading" class="note-title marker" id="h-note-59" aria-level="3"><span>Note</span></div><p class="">This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">telugu</a></code> style.</p></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('telugu-alpha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="telugu-alpha"><a href="#telugu-alpha">telugu-alpha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style telugu-alpha { system: alphabetic; symbols: '\C15' '\C16' '\C17' '\C18' '\C19' '\C1A' '\C58' '\C1B' '\C1C' '\C1D' '\C1E' '\C1F' '\C20' '\C21' '\C22' '\C23' '\C24' '\C25' '\C26' '\C27' '\C28' '\C2A' '\C2B' '\C2C' '\C2D' '\C2E' '\C2F' '\C30' '\C31' '\C32' '\C33' '\C34' '\C35' '\C36' '\C37' '\C38' '\C39' ; /* symbols: 'క' 'ఖ' 'గ' 'ఘ' 'ఙ' 'చ' 'ౘ' 'ఛ' 'జ' 'ఝ' 'ఞ' 'ట' 'ఠ' 'డ' 'ఢ' 'ణ' 'త' 'థ' 'ద' 'ధ' 'న' 'ప' 'ఫ' 'బ' 'భ' 'మ' 'య' 'ర' 'ఱ' 'ల' 'ళ' 'ఴ' 'వ' 'శ' 'ష' 'స' 'హ' ; */ suffix: ') '; } </bdo></code></p> <div id="out_telugu-alpha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="te" style="list-style-type: telugu-alpha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="te" style="list-style-type: telugu-alpha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="te" style="list-style-type: telugu-alpha;"><li>11</li></ol> <ol start="22" class="high" lang="te" style="list-style-type: telugu-alpha;"><li>22</li></ol> <ol start="33" class="high" lang="te" style="list-style-type: telugu-alpha;"><li>33</li></ol> <ol start="44" class="high" lang="te" style="list-style-type: telugu-alpha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="te" style="list-style-type: telugu-alpha;"><li>111</li></ol> <ol start="222" class="high" lang="te" style="list-style-type: telugu-alpha;"><li>222</li></ol> <ol start="333" class="high" lang="te" style="list-style-type: telugu-alpha;"><li>333</li></ol> <ol start="444" class="high" lang="te" style="list-style-type: telugu-alpha;"><li>444</li></ol></div> </div></div> <script>addExamples('telugu-alpha', 'te', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-60"><div role="heading" class="note-title marker" id="h-note-60" aria-level="3"><span>Note</span></div><aside class=""> <p><strong>Alternative prefix/suffix styles:</strong> <span class="linkToAffixes">(see <a href="#affixes" data-matched-text="[[[#affixes]]]" class="sec-ref"><bdi class="secno">1.1 </bdi>Adapting prefixes & suffixes</a>)</span><br> Use the following to change the default affixes:</p> <ol> <li style="list-style-type: none;"><code><bdo dir="ltr"> @counter-style telugu-alpha-dbl-paren { system: extends telugu-alpha; prefix: "("; suffix: ") "; } </bdo></code></li> </ol> </aside></div> </section> <section id="thai-styles"><div class="header-wrapper"><h2 id="x44-thai"><bdi class="secno">44. </bdi>Thai</h2><a class="self-link" href="#thai-styles" aria-label="Permalink for Section 44."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('thai')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="thai"><a href="#thai">thai</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style thai { system: numeric; symbols: '\E50' '\E51' '\E52' '\E53' '\E54' '\E55' '\E56' '\E57' '\E58' '\E59'; /* symbols: '๐' '๑' '๒' '๓' '๔' '๕' '๖' '๗' '๘' '๙'; */ } </bdo></code></p> <div id="out_thai" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="th" style="list-style-type: thai; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="th" style="list-style-type: thai; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="th" style="list-style-type: thai;"><li>11</li></ol> <ol start="22" class="high" lang="th" style="list-style-type: thai;"><li>22</li></ol> <ol start="33" class="high" lang="th" style="list-style-type: thai;"><li>33</li></ol> <ol start="44" class="high" lang="th" style="list-style-type: thai;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="th" style="list-style-type: thai;"><li>111</li></ol> <ol start="222" class="high" lang="th" style="list-style-type: thai;"><li>222</li></ol> <ol start="333" class="high" lang="th" style="list-style-type: thai;"><li>333</li></ol> <ol start="444" class="high" lang="th" style="list-style-type: thai;"><li>444</li></ol></div> </div></div> <script>addExamples('thai', 'th', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-61"><div role="heading" class="note-title marker" id="h-note-61" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">thai</code> style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">thai</a></code> style.</p> </aside></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('thai-alpha')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="thai-alpha"><a href="#thai-alpha">thai-alpha</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style thai-alpha { system: alphabetic; symbols: '\E01' '\E02' '\E04' '\E07' '\E08' '\E09' '\E0A' '\E0B' '\E0C' '\E0D' '\E0E' '\E0F' '\E10' '\E11' '\E12' '\E13' '\E14' '\E15' '\E16' '\E17' '\E18' '\E19' '\E1A' '\E1B' '\E1C' '\E1D' '\E1E' '\E1F' '\E20' '\E21' '\E22' '\E23' '\E25' '\E27' '\E28' '\E29' '\E2A' '\E2B' '\E2C' '\E2D' '\E2E'; /* symbols: 'ก' 'ข' 'ค' 'ง' 'จ' 'ฉ' 'ช' 'ซ' 'ฌ' 'ญ' 'ฎ' 'ฏ' 'ฐ' 'ฑ' 'ฒ' 'ณ' 'ด' 'ต' 'ถ' 'ท' 'ธ' 'น' 'บ' 'ป' 'ผ' 'ฝ' 'พ' 'ฟ' 'ภ' 'ม' 'ย' 'ร' 'ล' 'ว' 'ศ' 'ษ' 'ส' 'ห' 'ฬ' 'อ' 'ฮ'; */ } </bdo></code></p> <div id="out_thai-alpha" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="th" style="list-style-type: thai-alpha; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="th" style="list-style-type: thai-alpha; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="th" style="list-style-type: thai-alpha;"><li>11</li></ol> <ol start="22" class="high" lang="th" style="list-style-type: thai-alpha;"><li>22</li></ol> <ol start="33" class="high" lang="th" style="list-style-type: thai-alpha;"><li>33</li></ol> <ol start="44" class="high" lang="th" style="list-style-type: thai-alpha;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="th" style="list-style-type: thai-alpha;"><li>111</li></ol> <ol start="222" class="high" lang="th" style="list-style-type: thai-alpha;"><li>222</li></ol> <ol start="333" class="high" lang="th" style="list-style-type: thai-alpha;"><li>333</li></ol> <ol start="444" class="high" lang="th" style="list-style-type: thai-alpha;"><li>444</li></ol></div> </div></div> <script>addExamples('thai-alpha', 'th', '')</script> </div> </section> <section id="tibetan-styles"><div class="header-wrapper"><h2 id="x45-tibetan"><bdi class="secno">45. </bdi>Tibetan</h2><a class="self-link" href="#tibetan-styles" aria-label="Permalink for Section 45."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('tibetan')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="tibetan"><a href="#tibetan">tibetan</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style tibetan { system: numeric; symbols: '\F20' '\F21' '\F22' '\F23' '\F24' '\F25' '\F26' '\F27' '\F28' '\F29'; /* symbols: '༠' '༡' '༢' '༣' '༤' '༥' '༦' '༧' '༨' '༩'; */ } </bdo></code></p> <div id="out_tibetan" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="bo" style="list-style-type: tibetan; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="bo" style="list-style-type: tibetan; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="bo" style="list-style-type: tibetan;"><li>11</li></ol> <ol start="22" class="high" lang="bo" style="list-style-type: tibetan;"><li>22</li></ol> <ol start="33" class="high" lang="bo" style="list-style-type: tibetan;"><li>33</li></ol> <ol start="44" class="high" lang="bo" style="list-style-type: tibetan;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="bo" style="list-style-type: tibetan;"><li>111</li></ol> <ol start="222" class="high" lang="bo" style="list-style-type: tibetan;"><li>222</li></ol> <ol start="333" class="high" lang="bo" style="list-style-type: tibetan;"><li>333</li></ol> <ol start="444" class="high" lang="bo" style="list-style-type: tibetan;"><li>444</li></ol></div> </div></div> <script>addExamples('tibetan', 'bo', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-62"><div role="heading" class="note-title marker" id="h-note-62" aria-level="3"><span>Note</span></div><aside class=""> <p>This style is defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for the <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">tibetan</a></code> style.</p> </aside></div> </section> <section id="warangciti-styles"><div class="header-wrapper"><h2 id="x46-warang-citi"><bdi class="secno">46. </bdi>Warang Citi</h2><a class="self-link" href="#warangciti-styles" aria-label="Permalink for Section 46."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('warang-citi')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="warang-citi"><a href="#warang-citi">warang-citi</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style warang-citi { system: numeric; symbols: '\118E90' '\118E1' '\118E2' '\118E3' '\118E4' '\118E5' '\118E6' '\118E7' '\118E8' '\118E9'; /* symbols: '𑣠' '𑣡' '𑣢' '𑣣' '𑣤' '𑣥' '𑣦' '𑣧' '𑣨' '𑣩'; */ } </bdo></code></p> <div id="out_warang-citi" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="hoc" style="list-style-type: warang-citi; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="hoc" style="list-style-type: warang-citi; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="hoc" style="list-style-type: warang-citi;"><li>11</li></ol> <ol start="22" class="high" lang="hoc" style="list-style-type: warang-citi;"><li>22</li></ol> <ol start="33" class="high" lang="hoc" style="list-style-type: warang-citi;"><li>33</li></ol> <ol start="44" class="high" lang="hoc" style="list-style-type: warang-citi;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="hoc" style="list-style-type: warang-citi;"><li>111</li></ol> <ol start="222" class="high" lang="hoc" style="list-style-type: warang-citi;"><li>222</li></ol> <ol start="333" class="high" lang="hoc" style="list-style-type: warang-citi;"><li>333</li></ol> <ol start="444" class="high" lang="hoc" style="list-style-type: warang-citi;"><li>444</li></ol></div> </div></div> <script>addExamples('warang-citi', 'hoc', '')</script> </div> </section> <section id="digit-styles"><div class="header-wrapper"><h2 id="x47-european-digits-roman-etc"><bdi class="secno">47. </bdi>European Digits, Roman, etc.</h2><a class="self-link" href="#digit-styles" aria-label="Permalink for Section 47."></a></div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('binary')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="binary"><a href="#binary">binary</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style binary { system: numeric; symbols: '\30' '\31'; /* symbols: '0' '1'; */ } </bdo></code></p> <div id="out_binary" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: binary; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: binary; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: binary;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: binary;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: binary;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: binary;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: binary;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: binary;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: binary;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: binary;"><li>444</li></ol></div> </div></div> <script>addExamples('binary', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('tally-mark')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="tally-mark"><a href="#tally-mark">tally-mark</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style tally-mark { system: additive; additive-symbols: 5 '\1D378', 1 '\1D377'; /* symbols: 5 𝍸, 1 𝍷; */ suffix: ' '; } </bdo></code></p> <div id="out_tally-mark" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: tally-mark; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: tally-mark; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: tally-mark;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: tally-mark;"><li>22</li></ol></div></div> </div> <script>addExamples('tally-mark', 'en', '', 'vshort')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('circled-decimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="circled-decimal"><a href="#circled-decimal">circled-decimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style circled-decimal { system: fixed 0; symbols: '\24EA' '\2460' '\2461' '\2462' '\2463' '\2464' '\2465' '\2466' '\2467' '\2468' '\2469' '\246A' '\246B' '\246C' '\246D' '\246E' '\246F' '\2470' '\2471' '\2472' '\2473' '\3251' '\3252' '\3253' '\3254' '\3255' '\3256' '\3257' '\3258' '\3259' '\325a' '\325b' '\325c' '\325d' '\325e' '\325f' '\32b1' '\32b2' '\32b3' '\32b4' '\32b5' '\32b6' '\32b7' '\32b8' '\32b9' '\32ba' '\32bb' '\32bc' '\32bd' '\32be' '\32bf'; /* symbols: '⓪' '①' '②' '③' '④' '⑤' '⑥' '⑦' '⑧' '⑨' '⑩' '⑪' '⑫' '⑬' '⑭' '⑮' '⑯' '⑰' '⑱' '⑲' '⑳' '㉑' '㉒' '㉓' '㉔' '㉕' '㉖' '㉗' '㉘' '㉙' '㉚' '㉛' '㉜' '㉝' '㉞' '㉟' '㊱' '㊲' '㊳' '㊴' '㊵' '㊶' '㊷' '㊸' '㊹' '㊺' '㊻' '㊼' '㊽' '㊾' '㊿'; */ suffix: ' '; } </bdo></code></p> <div id="out_circled-decimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: circled-decimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: circled-decimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: circled-decimal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: circled-decimal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: circled-decimal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: circled-decimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: circled-decimal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: circled-decimal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: circled-decimal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: circled-decimal;"><li>444</li></ol></div> </div></div> <script>addExamples('circled-decimal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('circled-lower-latin')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="circled-lower-latin"><a href="#circled-lower-latin">circled-lower-latin</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style circled-lower-latin { system: fixed; symbols: '\24D0' '\24D1' '\24D2' '\24D3' '\24D4' '\24D5' '\24D6' '\24D7' '\24D8' '\24D9' '\24DA' '\24DB' '\24DC' '\24DD' '\24DE' '\24DF' '\24E0' '\24E1' '\24E2' '\24E3' '\24E4' '\24E5' '\24E6' '\24E7' '\24E8' '\24E9'; /* symbols: 'ⓐ' 'ⓑ' 'ⓒ' 'ⓓ' 'ⓔ' 'ⓕ' 'ⓖ' 'ⓗ' 'ⓘ' 'ⓙ' 'ⓚ' 'ⓛ' 'ⓜ' 'ⓝ' 'ⓞ' 'ⓟ' 'ⓠ' 'ⓡ' 'ⓢ' 'ⓣ' 'ⓤ' 'ⓥ' 'ⓦ' 'ⓧ' 'ⓨ' 'ⓩ'; */ suffix: ' '; } </bdo></code></p> <div id="out_circled-lower-latin" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: circled-lower-latin; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: circled-lower-latin; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: circled-lower-latin;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: circled-lower-latin;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: circled-lower-latin;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: circled-lower-latin;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: circled-lower-latin;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: circled-lower-latin;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: circled-lower-latin;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: circled-lower-latin;"><li>444</li></ol></div> </div></div> <script>addExamples('circled-lower-latin', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('circled-upper-latin')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="circled-upper-latin"><a href="#circled-upper-latin">circled-upper-latin</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style circled-upper-latin { system: fixed; symbols: '\24B6' '\24B7' '\24B8' '\24B9' '\24BA' '\24BB' '\24BC' '\24BD' '\24BE' '\24BF' '\24C0' '\24C1' '\24C2' '\24C3' '\24C4' '\24C5' '\24C6' '\24C7' '\24C8' '\24C9' '\24CA' '\24CB' '\24CC' '\24CD' '\24CE' '\24CF'; /* symbols: 'Ⓐ' 'Ⓑ' 'Ⓒ' 'Ⓓ' 'Ⓔ' 'Ⓕ' 'Ⓖ' 'Ⓗ' 'Ⓘ' 'Ⓙ' 'Ⓚ' 'Ⓛ' 'Ⓜ' 'Ⓝ' 'Ⓞ' 'Ⓟ' 'Ⓠ' 'Ⓡ' 'Ⓢ' 'Ⓣ' 'Ⓤ' 'Ⓥ' 'Ⓦ' 'Ⓧ' 'Ⓨ' 'Ⓩ'; */ suffix: ' '; } </bdo></code></p> <div id="out_circled-upper-latin" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: circled-upper-latin; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: circled-upper-latin; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: circled-upper-latin;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: circled-upper-latin;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: circled-upper-latin;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: circled-upper-latin;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: circled-upper-latin;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: circled-upper-latin;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: circled-upper-latin;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: circled-upper-latin;"><li>444</li></ol></div> </div></div> <script>addExamples('circled-upper-latin', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('decimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="decimal"><a href="#decimal">decimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style decimal { system: numeric; symbols: '\30' '\31' '\32' '\33' '\34' '\35' '\36' '\37' '\38' '\39'; /* symbols: '0' '1' '2' '3' '4' '5' '6' '7' '8' '9'; */ }</bdo></code></p> <div id="out_decimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: decimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: decimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: decimal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: decimal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: decimal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: decimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: decimal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: decimal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: decimal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: decimal;"><li>444</li></ol></div> </div></div> <script>addExamples('decimal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('decimal-leading-zero')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="decimal-leading-zero"><a href="#decimal-leading-zero">decimal-leading-zero</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style decimal-leading-zero { system: fixed -9; symbols: '\2D\30\39' '\2D\30\38' '\2D\30\37' '\2D\30\36' '\2D\30\35' '\2D\30\34' '\2D\30\33' '\2D\30\32' '\2D\30\31' '\30\30' '\30\31' '\30\32' '\30\33' '\30\34' '\30\35' '\30\36' '\30\37' '\30\38' '\30\39'; /* symbols: '-09' '-08' '-07' '-06' '-05' '-04' '-03' '-02' '-01' '00' '01' '02' '03' '04' '05' '06' '07' '08' '09'; */ } </bdo></code></p> <div id="out_decimal-leading-zero" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: decimal-leading-zero; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: decimal-leading-zero; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: decimal-leading-zero;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: decimal-leading-zero;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: decimal-leading-zero;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: decimal-leading-zero;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: decimal-leading-zero;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: decimal-leading-zero;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: decimal-leading-zero;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: decimal-leading-zero;"><li>444</li></ol></div> </div></div> <script>addExamples('decimal-leading-zero', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('dotted-decimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="dotted-decimal"><a href="#dotted-decimal">dotted-decimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style dotted-decimal { system: fixed; symbols: '\2488' '\2489' '\248A' '\248B' '\248C' '\248D' '\248E' '\248F' '\2490' '\2491' '\2492' '\2493' '\2494' '\2495' '\2496' '\2497' '\2498' '\2499' '\249A' '\249B'; /* symbols: '⒈' '⒉' '⒊' '⒋' '⒌' '⒍' '⒎' '⒏' '⒐' '⒑' '⒒' '⒓' '⒔' '⒕' '⒖' '⒗' '⒘' '⒙' '⒚' '⒛'; */ suffix: ' '; } </bdo></code></p> <div id="out_dotted-decimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: dotted-decimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: dotted-decimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: dotted-decimal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: dotted-decimal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: dotted-decimal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: dotted-decimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: dotted-decimal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: dotted-decimal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: dotted-decimal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: dotted-decimal;"><li>444</li></ol></div> </div></div> <script>addExamples('dotted-decimal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('double-circled-decimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="double-circled-decimal"><a href="#double-circled-decimal">double-circled-decimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style double-circled-decimal { system: fixed; symbols: '\24F5' '\24F6' '\24F7' '\24F8' '\24F9' '\24FA' '\24FB' '\24FC' '\24FD' '\24FE'; /* symbols: '⓵' '⓶' '⓷' '⓸' '⓹' '⓺' '⓻' '⓼' '⓽' '⓾'; */ suffix: ' '; } </bdo></code></p> <div id="out_double-circled-decimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: double-circled-decimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: double-circled-decimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: double-circled-decimal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: double-circled-decimal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: double-circled-decimal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: double-circled-decimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: double-circled-decimal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: double-circled-decimal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: double-circled-decimal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: double-circled-decimal;"><li>444</li></ol></div> </div></div> <script>addExamples('double-circled-decimal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('filled-circled-decimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="filled-circled-decimal"><a href="#filled-circled-decimal">filled-circled-decimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style filled-circled-decimal { system: fixed; symbols: '\2776' '\2777' '\2778' '\2779' '\277a' '\277b' '\277c' '\277d' '\277e' '\277f' '\24EB' '\24EC' '\24ED' '\24EE' '\24EF' '\24F0' '\24F1' '\24F2' '\24F3' '\24F4'; /* symbols: '❶' '❷' '❸' '❹' '❺' '❻' '❼' '❽' '❾' '❿' '⓫' '⓬' '⓭' '⓮' '⓯' '⓰' '⓱' '⓲' '⓳' '⓴'; */ suffix: ' '; } </bdo></code></p> <div id="out_filled-circled-decimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: filled-circled-decimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: filled-circled-decimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: filled-circled-decimal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: filled-circled-decimal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: filled-circled-decimal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: filled-circled-decimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: filled-circled-decimal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: filled-circled-decimal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: filled-circled-decimal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: filled-circled-decimal;"><li>444</li></ol></div> </div></div> <script>addExamples('filled-circled-decimal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('fullwidth-decimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="fullwidth-decimal"><a href="#fullwidth-decimal">fullwidth-decimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style fullwidth-decimal { system: numeric; symbols: '\FF10' '\FF11' '\FF12' '\FF13' '\FF14' '\FF15' '\FF16' '\FF17' '\FF18' '\FF19'; /* symbols: '０' '１' '２' '３' '４' '５' '６' '７' '８' '９'; */ suffix: '\FF0E'; /* suffix: '．'; */ } </bdo></code></p> <div id="out_fullwidth-decimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: fullwidth-decimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: fullwidth-decimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: fullwidth-decimal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: fullwidth-decimal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: fullwidth-decimal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: fullwidth-decimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: fullwidth-decimal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: fullwidth-decimal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: fullwidth-decimal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: fullwidth-decimal;"><li>444</li></ol></div> </div></div> <script>addExamples('fullwidth-decimal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('fullwidth-lower-roman')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="fullwidth-lower-roman"><a href="#fullwidth-lower-roman">fullwidth-lower-roman</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style § { system: fixed; symbols: '\2170' '\2171' '\2172' '\2173' '\2174' '\2175' '\2176' '\2177' '\2178' '\2179' '\217A' '\217B'; /* symbols: 'ⅰ' 'ⅱ' 'ⅲ' 'ⅳ' 'ⅴ' 'ⅵ' 'ⅶ' 'ⅷ' 'ⅸ' 'ⅹ' 'ⅺ' 'ⅻ'; */ suffix: ' '; } </bdo></code></p> <div id="out_fullwidth-lower-roman" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: fullwidth-lower-roman; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: fullwidth-lower-roman; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: fullwidth-lower-roman;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: fullwidth-lower-roman;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: fullwidth-lower-roman;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: fullwidth-lower-roman;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: fullwidth-lower-roman;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: fullwidth-lower-roman;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: fullwidth-lower-roman;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: fullwidth-lower-roman;"><li>444</li></ol></div> </div></div> <script>addExamples('fullwidth-lower-roman', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('fullwidth-upper-roman')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="fullwidth-upper-roman"><a href="#fullwidth-upper-roman">fullwidth-upper-roman</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style fullwidth-upper-roman { system: fixed; symbols: '\2160' '\2161' '\2162' '\2163' '\2164' '\2165' '\2166' '\2167' '\2168' '\2169' '\216A' '\216B'; /* symbols: 'Ⅰ' 'Ⅱ' 'Ⅲ' 'Ⅳ' 'Ⅴ' 'Ⅵ' 'Ⅶ' 'Ⅷ' 'Ⅸ' 'Ⅹ' 'Ⅺ' 'Ⅻ'; */ suffix: ' '; } </bdo></code></p> <div id="out_fullwidth-upper-roman" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: fullwidth-upper-roman; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: fullwidth-upper-roman; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: fullwidth-upper-roman;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: fullwidth-upper-roman;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: fullwidth-upper-roman;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: fullwidth-upper-roman;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: fullwidth-upper-roman;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: fullwidth-upper-roman;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: fullwidth-upper-roman;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: fullwidth-upper-roman;"><li>444</li></ol></div> </div></div> <script>addExamples('fullwidth-upper-roman', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-hexadecimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-hexadecimal"><a href="#lower-hexadecimal">lower-hexadecimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-hexadecimal { system: numeric; symbols: '\30' '\31' '\32' '\33' '\34' '\35' '\36' '\37' '\38' '\39' '\61' '\62' '\63' '\64' '\65' '\66'; /* symbols: '0' '1' '2' '3' '4' '5' '6' '7' '8' '9' 'a' 'b' 'c' 'd' 'e' 'f'; */ } </bdo></code></p> <div id="out_lower-hexadecimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: lower-hexadecimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: lower-hexadecimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: lower-hexadecimal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: lower-hexadecimal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: lower-hexadecimal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: lower-hexadecimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: lower-hexadecimal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: lower-hexadecimal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: lower-hexadecimal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: lower-hexadecimal;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-hexadecimal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('lower-roman')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="lower-roman"><a href="#lower-roman">lower-roman</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style lower-roman { system: additive; range: 1 3999; additive-symbols: 1000 '\6D', 900 '\63\6D', 500 '\64', 400 '\63\64', 100 '\63', 90 '\78\63', 50 '\6C', 40 '\78\6C', 10 '\78', 9 '\69\78', 5 '\76', 4 '\69\76', 1 '\69'; /* 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'; */ } </bdo></code></p> <div id="out_lower-roman" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: lower-roman; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: lower-roman; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: lower-roman;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: lower-roman;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: lower-roman;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: lower-roman;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: lower-roman;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: lower-roman;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: lower-roman;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: lower-roman;"><li>444</li></ol></div> </div></div> <script>addExamples('lower-roman', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('new-base-60')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="new-base-60"><a href="#new-base-60">new-base-60</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style new-base-60 { system: numeric; symbols: '\30' '\31' '\32' '\33' '\34' '\35' '\36' '\37' '\38' '\39' '\41' '\42' '\43' '\44' '\45' '\46' '\47' '\48' '\4A' '\4B' '\4C' '\4D' '\4E' '\50' '\51' '\52' '\53' '\54' '\55' '\56' '\57' '\58' '\59' '\5A' '\5F' '\61' '\62' '\63' '\64' '\65' '\66' '\67' '\68' '\69' '\6A' '\6B' '\6D' '\6E' '\6F' '\70' '\71' '\72' '\73' '\74' '\75' '\76' '\77' '\78' '\79' '\7A'; /* symbols: '0' '1' '2' '3' '4' '5' '6' '7' '8' '9' 'A' 'B' 'C' 'D' 'E' 'F' 'G' 'H' 'J' 'K' 'L' 'M' 'N' 'P' 'Q' 'R' 'S' 'T' 'U' 'V' 'W' 'X' 'Y' 'Z' '_' 'a' 'b' 'c' 'd' 'e' 'f' 'g' 'h' 'i' 'j' 'k' 'm' 'n' 'o' 'p' 'q' 'r' 's' 't' 'u' 'v' 'w' 'x' 'y' 'z'; */ } </bdo></code></p> <div id="out_new-base-60" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: new-base-60; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: new-base-60; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: new-base-60;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: new-base-60;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: new-base-60;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: new-base-60;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: new-base-60;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: new-base-60;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: new-base-60;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: new-base-60;"><li>444</li></ol></div> </div></div> <script>addExamples('new-base-60', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('octal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="octal"><a href="#octal">octal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style octal { system: numeric; symbols: '\30' '\31' '\32' '\33' '\34' '\35' '\36' '\37'; /* symbols: '0' '1' '2' '3' '4' '5' '6' '7'; */ } </bdo></code></p> <div id="out_octal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: octal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: octal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: octal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: octal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: octal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: octal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: octal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: octal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: octal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: octal;"><li>444</li></ol></div> </div></div> <script>addExamples('octal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('parenthesized-decimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="parenthesized-decimal"><a href="#parenthesized-decimal">parenthesized-decimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style parenthesized-decimal { system: fixed; symbols: '\2474' '\2475' '\2476' '\2477' '\2478' '\2479' '\247A' '\247B' '\247C' '\247D' '\247E' '\247F' '\2480' '\2481' '\2482' '\2483' '\2484' '\2485' '\2486' '\2487'; /* symbols: '⑴' '⑵' '⑶' '⑷' '⑸' '⑹' '⑺' '⑻' '⑼' '⑽' '⑾' '⑿' '⒀' '⒁' '⒂' '⒃' '⒄' '⒅' '⒆' '⒇'; */ suffix: ' '; } </bdo></code></p> <div id="out_parenthesized-decimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: parenthesized-decimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: parenthesized-decimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: parenthesized-decimal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: parenthesized-decimal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: parenthesized-decimal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: parenthesized-decimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: parenthesized-decimal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: parenthesized-decimal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: parenthesized-decimal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: parenthesized-decimal;"><li>444</li></ol></div> </div></div> <script>addExamples('parenthesized-decimal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('simple-lower-roman')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="simple-lower-roman"><a href="#simple-lower-roman">simple-lower-roman</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style simple-lower-roman { system: additive; range: 1 4999; additive-symbols: 1000 '\6D', 500 '\64', 100 '\63', 50 '\6C', 10 '\78', 5 '\76', 1 '\69'; /* additive-symbols: 1000 'm', 500 'd', 100 'c', 50 'l', 10 'x', 5 'v', 1 'i'; */ } </bdo></code></p> <div id="out_simple-lower-roman" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: simple-lower-roman; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: simple-lower-roman; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: simple-lower-roman;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: simple-lower-roman;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: simple-lower-roman;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: simple-lower-roman;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: simple-lower-roman;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: simple-lower-roman;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: simple-lower-roman;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: simple-lower-roman;"><li>444</li></ol></div> </div></div> <script>addExamples('simple-lower-roman', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('simple-upper-roman')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="simple-upper-roman"><a href="#simple-upper-roman">simple-upper-roman</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style simple-upper-roman { system: additive; range: 1 4999; additive-symbols: 1000 '\4D', 500 '\44', 100 '\43', 50 '\4C', 10 '\58', 5 '\56', 1 '\49'; /* additive-symbols: 1000 'M', 500 'D', 100 'C', 50 'L', 10 'X', 5 'V', 1 'I'; */ } </bdo></code></p> <div id="out_simple-upper-roman" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: simple-upper-roman; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: simple-upper-roman; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: simple-upper-roman;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: simple-upper-roman;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: simple-upper-roman;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: simple-upper-roman;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: simple-upper-roman;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: simple-upper-roman;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: simple-upper-roman;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: simple-upper-roman;"><li>444</li></ol></div> </div></div> <script>addExamples('simple-upper-roman', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('super-decimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="super-decimal"><a href="#super-decimal">super-decimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style super-decimal { system: numeric; symbols: '\2070' '\B9' '\B2' '\B3' '\2074' '\2075' '\2076' '\2077' '\2078' '\2079'; /* symbols: '⁰' '¹' '²' '³' '⁴' '⁵' '⁶' '⁷' '⁸' '⁹'; */ } </bdo></code></p> <div id="out_super-decimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: super-decimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: super-decimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: super-decimal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: super-decimal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: super-decimal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: super-decimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: super-decimal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: super-decimal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: super-decimal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: super-decimal;"><li>444</li></ol></div> </div></div> <script>addExamples('super-decimal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-hexadecimal')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-hexadecimal"><a href="#upper-hexadecimal">upper-hexadecimal</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-hexadecimal { system: numeric; symbols: '\30' '\31' '\32' '\33' '\34' '\35' '\36' '\37' '\38' '\39' '\41' '\42' '\43' '\44' '\45' '\46'; /* symbols: '0' '1' '2' '3' '4' '5' '6' '7' '8' '9' 'A' 'B' 'C' 'D' 'E' 'F'; */ } </bdo></code></p> <div id="out_upper-hexadecimal" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: upper-hexadecimal; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: upper-hexadecimal; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: upper-hexadecimal;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: upper-hexadecimal;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: upper-hexadecimal;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: upper-hexadecimal;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: upper-hexadecimal;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: upper-hexadecimal;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: upper-hexadecimal;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: upper-hexadecimal;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-hexadecimal', 'en', '')</script> </div> <div class="csWrapper"> <div class="copyMe" onclick="copyTemplate('upper-roman')"><img src="copy.svg" alt="Copy the style template." title="Copy the style template."></div> <p class="name" id="upper-roman"><a href="#upper-roman">upper-roman</a></p> <p class="counterstyle"><code><bdo dir="ltr"> @counter-style upper-roman { system: additive; range: 1 3999; additive-symbols: 1000 '\4D', 900 '\43\4D', 500 '\44', 400 '\43\44', 100 '\43', 90 '\58\43', 50 '\4C', 40 '\58\4C', 10 '\58', 9 '\49\58', 5 '\56', 4 '\49\56', 1 '\49'; /* 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'; */ } </bdo></code></p> <div id="out_upper-roman" class="browser_output"><p class="browser_output_title">Output in your browser:<a style="float:right" href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type#browser_compatibility" target="_blank"><img src="compat.svg" alt="Check for built-in browser support." title="Check for built-in browser support."></a></p><div class="template_container" style="display:flex; flex-direction:row; justify-content:space-between;"> <ol lang="en" style="list-style-type: upper-roman; display:block;"><li>one</li><li>two</li><li>three</li><li>four</li><li>five</li></ol> <ol start="6" lang="en" style="list-style-type: upper-roman; display:block;"><li>six</li><li>seven</li><li>eight</li><li>nine</li><li>ten</li></ol> <div> <ol start="11" class="high" lang="en" style="list-style-type: upper-roman;"><li>11</li></ol> <ol start="22" class="high" lang="en" style="list-style-type: upper-roman;"><li>22</li></ol> <ol start="33" class="high" lang="en" style="list-style-type: upper-roman;"><li>33</li></ol> <ol start="44" class="high" lang="en" style="list-style-type: upper-roman;"><li>44</li></ol></div><div> <ol start="111" class="high" lang="en" style="list-style-type: upper-roman;"><li>111</li></ol> <ol start="222" class="high" lang="en" style="list-style-type: upper-roman;"><li>222</li></ol> <ol start="333" class="high" lang="en" style="list-style-type: upper-roman;"><li>333</li></ol> <ol start="444" class="high" lang="en" style="list-style-type: upper-roman;"><li>444</li></ol></div> </div></div> <script>addExamples('upper-roman', 'en', '')</script> </div> <div class="note" role="note" id="issue-container-generatedID-63"><div role="heading" class="note-title marker" id="h-note-63" aria-level="3"><span>Note</span></div><aside class=""> <p>The <code class="kw" translate="no">lower-roman</code> and <code class="kw" translate="no">upper-roman</code> styles are defined in the <cite><a data-matched-text="[[[css-counter-styles-3]]]" href="https://www.w3.org/TR/css-counter-styles-3/">CSS Counter Styles Level 3</a></cite> specification. Check browser support for <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">lower-roman</a></code> and <code class="kw" translate="no"><a href="https://www.w3.org/International/i18n-tests/results/predefined-counter-styles#simplenumeric" target="_blank">upper-roman</a></code> styles.</p> </aside></div> </section> <section class="appendix" id="app-c"><div class="header-wrapper"><h2 id="a-revision-log"><bdi class="secno">A. </bdi> Revision Log</h2><a class="self-link" href="#app-c" aria-label="Permalink for Appendix A."></a></div> <p>The following summarises substantive changes since the previous publication.</p> <ol> <li>Add zhuyin style.</li> <li>Add Urdu styles.</li> </ol> <p>See the <a href="https://github.com/w3c/predefined-counter-styles/commits/gh-pages">github commit log</a> for more details.</p> </section> <section class="appendix" id="acknowledgements"><div class="header-wrapper"><h2 id="b-acknowledgements"><bdi class="secno">B. </bdi>Acknowledgements</h2><a class="self-link" href="#acknowledgements" aria-label="Permalink for Appendix B."></a></div> <p>Ian Hickson and Tantek Çelı̇k provided the majority of early contributions to this content. Additional significant contributions were made by Tab Atkins.</p> <p>Additional thanks to the following: Mati Allouche for help with Hebrew; George Schizas for help with Greek; <code class="kw" translate="no">cjk-tally-mark</code> and <code class="kw" translate="no">cjk-stem-branch</code> were proposed by @c933103, and <code class="kw" translate="no">tally-mark</code> by Mike Bremford; Yaibeelen Mangang and Amir Aharoni proposed <code class="kw" translate="no">meetei</code>; Prashant Verma and <abbr title="Centre for Development of Advanced Computing">CDAC</abbr> provided templates for 17 Indian styles, including [Arabic] <a href="#kashmiri"><code class="kw" translate="no">kashmiri</code></a>, [Bengali] <a href="#bangla"><code class="kw" translate="no">bangla</code></a>, [Devanagari] <a href="#bodo"><code class="kw" translate="no">bodo</code></a>, <a href="#dogri"><code class="kw" translate="no">dogri</code></a>, <a href="#konkani"><code class="kw" translate="no">konkani</code></a>, <a href="#maithili"><code class="kw" translate="no">maithili</code></a>, <a href="#marathi"><code class="kw" translate="no">marathi</code></a>, <a href="#sanskrit"><code class="kw" translate="no">sanskrit</code></a>, <a href="#sindhi"><code class="kw" translate="no">sindhi</code></a>, [Gujarati] <a href="#gujarati-alpha"><code class="kw" translate="no">gujarati-alpha</code></a>, [Gurmukhi] <a href="#punjabi"><code class="kw" translate="no">punjabi</code></a>, [Kannada] <a href="#kannada-alpha"><code class="kw" translate="no">kannada-alpha</code></a>, [Malayalam] <a href="#malayalam-alpha"><code class="kw" translate="no">malayalam-alpha</code></a>, [Meetei] <a href="#manipuri"><code class="kw" translate="no">manipuri</code></a>, [Ol Chiki] <a href="#santali"><code class="kw" translate="no">santali</code></a>, [Oriya] <a href="#odia"><code class="kw" translate="no">odia</code></a>, [Telugu] <a href="#telugu"><code class="kw" translate="no">telugu</code></a>; Klemen Kogovšek proposed changing 'serbo-croatian' to just 'serbian'; Saadat Mateen for help with Urdu; @NFSL2001 for proposing 'zhuyin'. </p> </section> <script> var cs = document.querySelectorAll('.name').length document.getElementById('stats').textContent = cs </script> <section id="references" class="appendix"><div class="header-wrapper"><h2 id="c-references"><bdi class="secno">C. </bdi>References</h2><a class="self-link" href="#references" aria-label="Permalink for Appendix C."></a></div><section id="informative-references"><div class="header-wrapper"><h3 id="c-1-informative-references"><bdi class="secno">C.1 </bdi>Informative references</h3><a class="self-link" href="#informative-references" aria-label="Permalink for Appendix C.1"></a></div> <dl class="bibliography"><dt id="bib-css-counter-styles-3">[css-counter-styles-3]</dt><dd> <a href="https://www.w3.org/TR/css-counter-styles-3/"><cite>CSS Counter Styles Level 3</cite></a>. Tab Atkins Jr.. W3C. 27 July 2021. W3C Candidate Recommendation. URL: <a href="https://www.w3.org/TR/css-counter-styles-3/">https://www.w3.org/TR/css-counter-styles-3/</a> </dd></dl> </section></section><p role="navigation" id="back-to-top"> <a href="#title"><abbr title="Back to Top">↑</abbr></a> </p><script id="respec-dfn-panel">(() => { // @ts-check if (document.respec) { document.respec.ready.then(setupPanel); } else { setupPanel(); } function setupPanel() { const listener = panelListener(); document.body.addEventListener("keydown", listener); document.body.addEventListener("click", listener); } function panelListener() { /** @type {HTMLElement} */ let panel = null; return event => { const { target, type } = event; if (!(target instanceof HTMLElement)) return; // For keys, we only care about Enter key to activate the panel // otherwise it's activated via a click. if (type === "keydown" && event.key !== "Enter") return; const action = deriveAction(event); switch (action) { case "show": { hidePanel(panel); /** @type {HTMLElement} */ const dfn = target.closest("dfn, .index-term"); panel = document.getElementById(`dfn-panel-for-${dfn.id}`); const coords = deriveCoordinates(event); displayPanel(dfn, panel, coords); break; } case "dock": { panel.style.left = null; panel.style.top = null; panel.classList.add("docked"); break; } case "hide": { hidePanel(panel); panel = null; break; } } }; } /** * @param {MouseEvent|KeyboardEvent} event */ function deriveCoordinates(event) { const target = /** @type HTMLElement */ (event.target); // We prevent synthetic AT clicks from putting // the dialog in a weird place. The AT events sometimes // lack coordinates, so they have clientX/Y = 0 const rect = target.getBoundingClientRect(); if ( event instanceof MouseEvent && event.clientX >= rect.left && event.clientY >= rect.top ) { // The event probably happened inside the bounding rect... return { x: event.clientX, y: event.clientY }; } // Offset to the middle of the element const x = rect.x + rect.width / 2; // Placed at the bottom of the element const y = rect.y + rect.height; return { x, y }; } /** * @param {Event} event */ function deriveAction(event) { const target = /** @type {HTMLElement} */ (event.target); const hitALink = !!target.closest("a"); if (target.closest("dfn:not([data-cite]), .index-term")) { return hitALink ? "none" : "show"; } if (target.closest(".dfn-panel")) { if (hitALink) { return target.classList.contains("self-link") ? "hide" : "dock"; } const panel = target.closest(".dfn-panel"); return panel.classList.contains("docked") ? "hide" : "none"; } if (document.querySelector(".dfn-panel:not([hidden])")) { return "hide"; } return "none"; } /** * @param {HTMLElement} dfn * @param {HTMLElement} panel * @param {{ x: number, y: number }} clickPosition */ function displayPanel(dfn, panel, { x, y }) { panel.hidden = false; // distance (px) between edge of panel and the pointing triangle (caret) const MARGIN = 20; const dfnRects = dfn.getClientRects(); // Find the `top` offset when the `dfn` can be spread across multiple lines let closestTop = 0; let minDiff = Infinity; for (const rect of dfnRects) { const { top, bottom } = rect; const diffFromClickY = Math.abs((top + bottom) / 2 - y); if (diffFromClickY < minDiff) { minDiff = diffFromClickY; closestTop = top; } } const top = window.scrollY + closestTop + dfnRects[0].height; const left = x - MARGIN; panel.style.left = `${left}px`; panel.style.top = `${top}px`; // Find if the panel is flowing out of the window const panelRect = panel.getBoundingClientRect(); const SCREEN_WIDTH = Math.min(window.innerWidth, window.screen.width); if (panelRect.right > SCREEN_WIDTH) { const newLeft = Math.max(MARGIN, x + MARGIN - panelRect.width); const newCaretOffset = left - newLeft; panel.style.left = `${newLeft}px`; /** @type {HTMLElement} */ const caret = panel.querySelector(".caret"); caret.style.left = `${newCaretOffset}px`; } // As it's a dialog, we trap focus. // TODO: when <dialog> becomes a implemented, we should really // use that. trapFocus(panel, dfn); } /** * @param {HTMLElement} panel * @param {HTMLElement} dfn * @returns */ function trapFocus(panel, dfn) { /** @type NodeListOf<HTMLAnchorElement> elements */ const anchors = panel.querySelectorAll("a[href]"); // No need to trap focus if (!anchors.length) return; // Move focus to first anchor element const first = anchors.item(0); first.focus(); const trapListener = createTrapListener(anchors, panel, dfn); panel.addEventListener("keydown", trapListener); // Hiding the panel releases the trap const mo = new MutationObserver(records => { const [record] = records; const target = /** @type HTMLElement */ (record.target); if (target.hidden) { panel.removeEventListener("keydown", trapListener); mo.disconnect(); } }); mo.observe(panel, { attributes: true, attributeFilter: ["hidden"] }); } /** * * @param {NodeListOf<HTMLAnchorElement>} anchors * @param {HTMLElement} panel * @param {HTMLElement} dfn * @returns */ function createTrapListener(anchors, panel, dfn) { const lastIndex = anchors.length - 1; let currentIndex = 0; return event => { switch (event.key) { // Hitting "Tab" traps us in a nice loop around elements. case "Tab": { event.preventDefault(); currentIndex += event.shiftKey ? -1 : +1; if (currentIndex < 0) { currentIndex = lastIndex; } else if (currentIndex > lastIndex) { currentIndex = 0; } anchors.item(currentIndex).focus(); break; } // Hitting "Enter" on an anchor releases the trap. case "Enter": hidePanel(panel); break; // Hitting "Escape" returns focus to dfn. case "Escape": hidePanel(panel); dfn.focus(); return; } }; } /** @param {HTMLElement} panel */ function hidePanel(panel) { if (!panel) return; panel.hidden = true; panel.classList.remove("docked"); } })()</script><script src="https://www.w3.org/scripts/TR/2021/fixup.js"></script></body></html>