1111944-1-list-marker-ref.html (3256B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <style> 6 body { 7 font-family: Arial, sans-serif; 8 font-size: 16px; 9 line-height: 24px; 10 } 11 .outer { 12 display: inline-block; 13 vertical-align: top; 14 width: 380px; 15 height: 180px; 16 border: 1px solid blue; 17 margin: 5px; 18 } 19 .ol { 20 margin: 0 12px; 21 } 22 .m1 { 23 display: inline-block; 24 height: 40px; 25 text-align: right; 26 } 27 .m2 { 28 display: inline-block; 29 height: 5em; 30 text-align: right; 31 } 32 </style> 33 </head> 34 <body> 35 Test for list item markers in vertical mode: 36 <br> 37 <div class="outer" style="writing-mode:vertical-lr;text-orientation:sideways-right"> 38 Mode vertical-lr, style lower-roman: 39 <div class="ol"> 40 <span class="m1">i. </span>one<br> 41 <span class="m1">ii. </span>two<br> 42 <span class="m1">iii. </span>three<br> 43 <span class="m1">iv. </span>four<br> 44 <span class="m1">v. </span>five<br> 45 <span class="m1">vi. </span>six<br> 46 <span class="m1">vii. </span>seven<br> 47 <span class="m1">viii. </span>eight<br> 48 <span class="m1">ix. </span>nine<br> 49 <span class="m1">x. </span>ten<br> 50 <span class="m1">xi. </span>eleven<br> 51 <span class="m1">xii. </span>twelve<br> 52 </div> 53 </div> 54 <div class="outer" style="writing-mode:vertical-rl;text-orientation:sideways-right"> 55 Mode vertical-rl, style hebrew: 56 <div class="ol"> 57 <span class="m1">א. </span>one<br> 58 <span class="m1">ב. </span>two<br> 59 <span class="m1">ג. </span>three<br> 60 <span class="m1">ד. </span>four<br> 61 <span class="m1">ה. </span>five<br> 62 <span class="m1">ו. </span>six<br> 63 <span class="m1">ז. </span>seven<br> 64 <span class="m1">ח. </span>eight<br> 65 <span class="m1">ט. </span>nine<br> 66 <span class="m1">י. </span>ten<br> 67 <span class="m1">יא. </span>eleven<br> 68 <span class="m1">יב. </span>twelve<br> 69 </div> 70 </div> 71 <br> 72 <div class="outer" style="writing-mode:vertical-lr"> 73 Mode vertical-lr, style trad-chinese-formal: 74 <div class="ol"> 75 <span class="m2">壹、</span>one<br> 76 <span class="m2">貳、</span>two<br> 77 <span class="m2">參、</span>three<br> 78 <span class="m2">肆、</span>four<br> 79 <span class="m2">伍、</span>five<br> 80 <span class="m2">陸、</span>six<br> 81 <span class="m2">柒、</span>seven<br> 82 <span class="m2">捌、</span>eight<br> 83 <span class="m2">玖、</span>nine<br> 84 <span class="m2">壹拾、</span>ten<br> 85 <span class="m2">壹拾壹、</span>eleven<br> 86 <span class="m2">壹拾貳、</span>twelve<br> 87 </div> 88 </div> 89 <div class="outer" style="writing-mode:vertical-rl"> 90 Mode vertical-rl, style japanese-informal: 91 <div class="ol"> 92 <span class="m2">一、</span>one<br> 93 <span class="m2">二、</span>two<br> 94 <span class="m2">三、</span>three<br> 95 <span class="m2">四、</span>four<br> 96 <span class="m2">五、</span>five<br> 97 <span class="m2">六、</span>six<br> 98 <span class="m2">七、</span>seven<br> 99 <span class="m2">八、</span>eight<br> 100 <span class="m2">九、</span>nine<br> 101 <span class="m2">十、</span>ten<br> 102 <span class="m2">十一、</span>eleven<br> 103 <span class="m2">十二、</span>twelve<br> 104 </div> 105 </div> 106 </body> 107 </html>