PageRenderTime 66ms CodeModel.GetById 30ms RepoModel.GetById 0ms app.codeStats 0ms

/third_party/WebKit/LayoutTests/imported/csswg-test/css-writing-modes-3/text-orientation-script-001j.html

https://gitlab.com/jonnialva90/iridium-browser
HTML | 148 lines | 148 code | 0 blank | 0 comment | 0 complexity | 31f8e2503d835cf3c7af980630b0384a MD5 | raw file
    

  1. <!DOCTYPE html>
    2. 

  2. <meta charset="utf-8">
    3. 

  3. <title>CSS Writing Modes Test: Test orientation of characters where vo=U (#2/5, 2048 code points in U+2ED8-A387).</title>
    4. 

  4. <link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation">
    5. 

  5. <meta name="assert" content="Test orientation of characters where vo=U (#2/5, 2048 code points in U+2ED8-A387)">
    6. 

  6. <meta name="flags" content="dom font">
    7. 

  7. <link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
    8. 

  8. <script src="../../../resources/testharness.js"></script>
    9. 

  9. <script src="../../../resources/testharnessreport.js"></script>
    10. 

  10. <style>
    11. 

  11. @font-face {
    12. 

  12.     font-family: "orientation";
    13. 

  13.     src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
    14. 

  14. }
    15. 

  15. .test {
    16. 

  16.     font: 16px/1 "orientation";
    17. 

  17.     height: 17em;
    18. 

  18.     -webkit-writing-mode: vertical-rl;
    19. 

  19. }
    20. 

  20. .line {
    21. 

  21.     white-space: pre;
    22. 

  22. }
    23. 

  23. .U {
    24. 

  24.     -webkit-text-orientation: upright;
    25. 

  25. }
    26. 

  26. .R {
    27. 

  27.     -webkit-text-orientation: sideways-right;
    28. 

  28. }
    29. 

  29. #details {
    30. 

  30.     margin: 1em .5em;
    31. 

  31. }
    32. 

  32. summary {
    33. 

  33.     font-size: 1.2em;
    34. 

  34.     font-weight: bold;
    35. 

  35.     margin-top: .5em;
    36. 

  36. }
    37. 

  37. </style>
    38. 

  38. <div id="log"></div>
    39. 

  39. <div id="details"></div>
    40. 

  40. <div id="container">
    41. 

  41. <div data-vo="U" class="test">
    42. 

  42. <div data-block="CJK">
    43. 

  43. <div class="line">⻘⻙⻚⻛⻜⻝⻞⻟⻠⻡⻢⻣⻤⻥⻦⻧⻨⻩⻪⻫⻬⻭⻮⻯⻰⻱⻲⻳</div>
    44. 

  44. </div>
    45. 

  45. <div data-block="Kangxi">
    46. 

  46. <div class="line">⼀⼁⼂⼃⼄⼅⼆⼇⼈⼉⼊⼋⼌⼍⼎⼏⼐⼑⼒⼓⼔⼕⼖⼗⼘⼙⼚⼛⼜⼝⼞⼟</div>
    47. 

  47. <div class="line">⼠⼡⼢⼣⼤⼥⼦⼧⼨⼩⼪⼫⼬⼭⼮⼯⼰⼱⼲⼳⼴⼵⼶⼷⼸⼹⼺⼻⼼⼽⼾⼿</div>
    48. 

  48. <div class="line">⽀⽁⽂⽃⽄⽅⽆⽇⽈⽉⽊⽋⽌⽍⽎⽏⽐⽑⽒⽓⽔⽕⽖⽗⽘⽙⽚⽛⽜⽝⽞⽟</div>
    49. 

  49. <div class="line">⽠⽡⽢⽣⽤⽥⽦⽧⽨⽩⽪⽫⽬⽭⽮⽯⽰⽱⽲⽳⽴⽵⽶⽷⽸⽹⽺⽻⽼⽽⽾⽿</div>
    50. 

  50. <div class="line">⾀⾁⾂⾃⾄⾅⾆⾇⾈⾉⾊⾋⾌⾍⾎⾏⾐⾑⾒⾓⾔⾕⾖⾗⾘⾙⾚⾛⾜⾝⾞⾟</div>
    51. 

  51. <div class="line">⾠⾡⾢⾣⾤⾥⾦⾧⾨⾩⾪⾫⾬⾭⾮⾯⾰⾱⾲⾳⾴⾵⾶⾷⾸⾹⾺⾻⾼⾽⾾⾿</div>
    52. 

  52. <div class="line">⿀⿁⿂⿃⿄⿅⿆⿇⿈⿉⿊⿋⿌⿍⿎⿏⿐⿑⿒⿓⿔⿕</div>
    53. 

  53. </div>
    54. 

  54. <div data-block="Ideographic">
    55. 

  55. <div class="line">⿰⿱⿲⿳⿴⿵⿶⿷⿸⿹⿺⿻</div>
    56. 

  56. </div>
    57. 

  57. <div data-block="CJK">
    58. 

  58. <div class="line">　〃〄々〆〇〒〓〠〡〢〣〤〥〦〧〨〩〱〲〳〴〵〶〷〸〹〺〻〼〽〾</div>
    59. 

  59. <div class="line">〿</div>
    60. 

  60. </div>
    61. 

  61. <div data-block="Hiragana">
    62. 

  62. <div class="line">あいうえおかがきぎくぐけげこごさざしじすずせぜそぞただちぢつづて</div>
    63. 

  63. <div class="line">でとどなにぬねのはばぱひびぴふぶぷへべぺほぼぽまみむめもやゆよら</div>
    64. 

  64. <div class="line">りるれろわゐゑをんゔゝゞゟ</div>
    65. 

  65. </div>
    66. 

  66. <div data-block="Katakana">
    67. 

  67. <div class="line">アイウエオカガキギクグケゲコゴサザシジスズセゼソゾタダチヂツヅテ</div>
    68. 

  68. <div class="line">デトドナニヌネノハバパヒビピフブプヘベペホボポマミムメモヤユヨラ</div>
    69. 

  69. <div class="line">リルレロワヰヱヲンヴヷヸヹヺ・ヽヾヿ</div>
    70. 

  70. </div>
    71. 

  71. <div data-block="Bopomofo">
    72. 

  72. <div class="line">ㄅㄆㄇㄈㄉㄊㄋㄌㄍㄎㄏㄐㄑㄒㄓㄔㄕㄖㄗㄘㄙㄚㄛㄜㄝㄞㄟㄠㄡㄢㄣㄤ</div>
    73. 

  73. <div class="line">ㄥㄦㄨㄩㄪㄫㄬㄭ</div>
    74. 

  74. </div>
    75. 

  75. <div data-block="Hangul">
    76. 

  76. <div class="line">ㄱㄲㄳㄴㄵㄶㄷㄸㄹㄺㄻㄼㄽㄾㄿㅀㅁㅂㅃㅄㅅㅆㅇㅈㅉㅊㅋㅌㅍㅎㅏㅐ</div>
    77. 

  77. <div class="line">ㅑㅒㅓㅔㅕㅖㅗㅘㅙㅚㅛㅜㅝㅞㅟㅠㅡㅢㅣㅤㅥㅦㅧㅨㅩㅪㅫㅬㅭㅮㅯㅰ</div>
    78. 

  78. <div class="line">ㅱㅲㅳㅴㅵㅶㅷㅸㅹㅺㅻㅼㅽㅾㅿㆀㆁㆂㆃㆄㆅㆆㆇㆈㆉㆊㆋㆌㆍㆎ</div>
    79. 

  79. </div>
    80. 

  80. <div data-block="Kanbun">
    81. 

  81. <div class="line">㆐㆑㆒㆓㆔㆕㆖㆗㆘㆙㆚㆛㆜㆝㆞㆟</div>
    82. 

  82. </div>
    83. 

  83. <div data-block="Bopomofo">
    84. 

  84. <div class="line">ㆠㆡㆢㆣㆤㆥㆦㆧㆨㆩㆪㆫㆬㆭㆮㆯㆰㆱㆲㆳㆴㆵㆶㆷㆸㆹㆺ</div>
    85. 

  85. </div>
    86. 

  86. <div data-block="CJK">
    87. 

  87. <div class="line">㇀㇁㇂㇃㇄㇅㇆㇇㇈㇉㇊㇋㇌㇍㇎㇏㇐㇑㇒㇓㇔㇕㇖㇗㇘㇙㇚㇛㇜㇝㇞㇟</div>
    88. 

  88. <div class="line">㇠㇡㇢㇣</div>
    89. 

  89. </div>
    90. 

  90. <div data-block="Enclosed">
    91. 

  91. <div class="line">㈀㈁㈂㈃㈄㈅㈆㈇㈈㈉㈊㈋㈌㈍㈎㈏㈐㈑㈒㈓㈔㈕㈖㈗㈘㈙㈚㈛㈜㈝㈞㈠</div>
    92. 

  92. <div class="line">㈡㈢㈣㈤㈥㈦㈧㈨㈩㈪㈫㈬㈭㈮㈯㈰㈱㈲㈳㈴㈵㈶㈷㈸㈹㈺㈻㈼㈽㈾㈿㉀</div>
    93. 

  93. <div class="line">㉁㉂㉃㉄㉅㉆㉇㉈㉉㉊㉋㉌㉍㉎㉏㉐㉑㉒㉓㉔㉕㉖㉗㉘㉙㉚㉛㉜㉝㉞㉟㉠</div>
    94. 

  94. <div class="line">㉡㉢㉣㉤㉥㉦㉧㉨㉩㉪㉫㉬㉭㉮㉯㉰㉱㉲㉳㉴㉵㉶㉷㉸㉹㉺㉻㉼㉽㉾㉿㊀</div>
    95. 

  95. <div class="line">㊁㊂㊃㊄㊅㊆㊇㊈㊉㊊㊋㊌㊍㊎㊏㊐㊑㊒㊓㊔㊕㊖㊗㊘㊙㊚㊛㊜㊝㊞㊟㊠</div>
    96. 

  96. <div class="line">㊡㊢㊣㊤㊥㊦㊧㊨㊩㊪㊫㊬㊭㊮㊯㊰㊱㊲㊳㊴㊵㊶㊷㊸㊹㊺㊻㊼㊽㊾㊿㋀</div>
    97. 

  97. <div class="line">㋁㋂㋃㋄㋅㋆㋇㋈㋉㋊㋋㋌㋍㋎㋏㋐㋑㋒㋓㋔㋕㋖㋗㋘㋙㋚㋛㋜㋝㋞㋟㋠</div>
    98. 

  98. <div class="line">㋡㋢㋣㋤㋥㋦㋧㋨㋩㋪㋫㋬㋭㋮㋯㋰㋱㋲㋳㋴㋵㋶㋷㋸㋹㋺㋻㋼㋽㋾</div>
    99. 

  99. </div>
    100. 

  100. <div data-block="CJK">
    101. 

  101. <div class="line">㍘㍙㍚㍛㍜㍝㍞㍟㍠㍡㍢㍣㍤㍥㍦㍧㍨㍩㍪㍫㍬㍭㍮㍯㍰㍱㍲㍳㍴㍵㍶㍷</div>
    102. 

  102. <div class="line">㍸㍹㍺㎀㎁㎂㎃㎄㎅㎆㎇㎈㎉㎊㎋㎌㎍㎎㎏㎐㎑㎒㎓㎔㎕㎖㎗㎘㎙㎚㎛㎜</div>
    103. 

  103. <div class="line">㎝㎞㎟㎠㎡㎢㎣㎤㎥㎦㎧㎨㎩㎪㎫㎬㎭㎮㎯㎰㎱㎲㎳㎴㎵㎶㎷㎸㎹㎺㎻㎼</div>
    104. 

  104. <div class="line">㎽㎾㎿㏀㏁㏂㏃㏄㏅㏆㏇㏈㏉㏊㏋㏌㏍㏎㏏㏐㏑㏒㏓㏔㏕㏖㏗㏘㏙㏚㏛㏜</div>
    105. 

  105. <div class="line">㏝㏞㏟㏠㏡㏢㏣㏤㏥㏦㏧㏨㏩㏪㏫㏬㏭㏮㏯㏰㏱㏲㏳㏴㏵㏶㏷㏸㏹㏺㏻㏼</div>
    106. 

  106. <div class="line">㏽㏾㏿㐀䶵</div>
    107. 

  107. </div>
    108. 

  108. <div data-block="Yijing">
    109. 

  109. <div class="line">䷀䷁䷂䷃䷄䷅䷆䷇䷈䷉䷊䷋䷌䷍䷎䷏䷐䷑䷒䷓䷔䷕䷖䷗䷘䷙䷚䷛䷜䷝䷞䷟</div>
    110. 

  110. <div class="line">䷠䷡䷢䷣䷤䷥䷦䷧䷨䷩䷪䷫䷬䷭䷮䷯䷰䷱䷲䷳䷴䷵䷶䷷䷸䷹䷺䷻䷼䷽䷾䷿</div>
    111. 

  111. </div>
    112. 

  112. <div data-block="CJK">
    113. 

  113. <div class="line">一鿌</div>
    114. 

  114. </div>
    115. 

  115. <div data-block="Yi">
    116. 

  116. <div class="line">ꀀꀁꀂꀃꀄꀅꀆꀇꀈꀉꀊꀋꀌꀍꀎꀏꀐꀑꀒꀓꀔꀕꀖꀗꀘꀙꀚꀛꀜꀝꀞꀟ</div>
    117. 

  117. <div class="line">ꀠꀡꀢꀣꀤꀥꀦꀧꀨꀩꀪꀫꀬꀭꀮꀯꀰꀱꀲꀳꀴꀵꀶꀷꀸꀹꀺꀻꀼꀽꀾꀿ</div>
    118. 

  118. <div class="line">ꁀꁁꁂꁃꁄꁅꁆꁇꁈꁉꁊꁋꁌꁍꁎꁏꁐꁑꁒꁓꁔꁕꁖꁗꁘꁙꁚꁛꁜꁝꁞꁟ</div>
    119. 

  119. <div class="line">ꁠꁡꁢꁣꁤꁥꁦꁧꁨꁩꁪꁫꁬꁭꁮꁯꁰꁱꁲꁳꁴꁵꁶꁷꁸꁹꁺꁻꁼꁽꁾꁿ</div>
    120. 

  120. <div class="line">ꂀꂁꂂꂃꂄꂅꂆꂇꂈꂉꂊꂋꂌꂍꂎꂏꂐꂑꂒꂓꂔꂕꂖꂗꂘꂙꂚꂛꂜꂝꂞꂟ</div>
    121. 

  121. <div class="line">ꂠꂡꂢꂣꂤꂥꂦꂧꂨꂩꂪꂫꂬꂭꂮꂯꂰꂱꂲꂳꂴꂵꂶꂷꂸꂹꂺꂻꂼꂽꂾꂿ</div>
    122. 

  122. <div class="line">ꃀꃁꃂꃃꃄꃅꃆꃇꃈꃉꃊꃋꃌꃍꃎꃏꃐꃑꃒꃓꃔꃕꃖꃗꃘꃙꃚꃛꃜꃝꃞꃟ</div>
    123. 

  123. <div class="line">ꃠꃡꃢꃣꃤꃥꃦꃧꃨꃩꃪꃫꃬꃭꃮꃯꃰꃱꃲꃳꃴꃵꃶꃷꃸꃹꃺꃻꃼꃽꃾꃿ</div>
    124. 

  124. <div class="line">ꄀꄁꄂꄃꄄꄅꄆꄇꄈꄉꄊꄋꄌꄍꄎꄏꄐꄑꄒꄓꄔꄕꄖꄗꄘꄙꄚꄛꄜꄝꄞꄟ</div>
    125. 

  125. <div class="line">ꄠꄡꄢꄣꄤꄥꄦꄧꄨꄩꄪꄫꄬꄭꄮꄯꄰꄱꄲꄳꄴꄵꄶꄷꄸꄹꄺꄻꄼꄽꄾꄿ</div>
    126. 

  126. <div class="line">ꅀꅁꅂꅃꅄꅅꅆꅇꅈꅉꅊꅋꅌꅍꅎꅏꅐꅑꅒꅓꅔꅕꅖꅗꅘꅙꅚꅛꅜꅝꅞꅟ</div>
    127. 

  127. <div class="line">ꅠꅡꅢꅣꅤꅥꅦꅧꅨꅩꅪꅫꅬꅭꅮꅯꅰꅱꅲꅳꅴꅵꅶꅷꅸꅹꅺꅻꅼꅽꅾꅿ</div>
    128. 

  128. <div class="line">ꆀꆁꆂꆃꆄꆅꆆꆇꆈꆉꆊꆋꆌꆍꆎꆏꆐꆑꆒꆓꆔꆕꆖꆗꆘꆙꆚꆛꆜꆝꆞꆟ</div>
    129. 

  129. <div class="line">ꆠꆡꆢꆣꆤꆥꆦꆧꆨꆩꆪꆫꆬꆭꆮꆯꆰꆱꆲꆳꆴꆵꆶꆷꆸꆹꆺꆻꆼꆽꆾꆿ</div>
    130. 

  130. <div class="line">ꇀꇁꇂꇃꇄꇅꇆꇇꇈꇉꇊꇋꇌꇍꇎꇏꇐꇑꇒꇓꇔꇕꇖꇗꇘꇙꇚꇛꇜꇝꇞꇟ</div>
    131. 

  131. <div class="line">ꇠꇡꇢꇣꇤꇥꇦꇧꇨꇩꇪꇫꇬꇭꇮꇯꇰꇱꇲꇳꇴꇵꇶꇷꇸꇹꇺꇻꇼꇽꇾꇿ</div>
    132. 

  132. <div class="line">ꈀꈁꈂꈃꈄꈅꈆꈇꈈꈉꈊꈋꈌꈍꈎꈏꈐꈑꈒꈓꈔꈕꈖꈗꈘꈙꈚꈛꈜꈝꈞꈟ</div>
    133. 

  133. <div class="line">ꈠꈡꈢꈣꈤꈥꈦꈧꈨꈩꈪꈫꈬꈭꈮꈯꈰꈱꈲꈳꈴꈵꈶꈷꈸꈹꈺꈻꈼꈽꈾꈿ</div>
    134. 

  134. <div class="line">ꉀꉁꉂꉃꉄꉅꉆꉇꉈꉉꉊꉋꉌꉍꉎꉏꉐꉑꉒꉓꉔꉕꉖꉗꉘꉙꉚꉛꉜꉝꉞꉟ</div>
    135. 

  135. <div class="line">ꉠꉡꉢꉣꉤꉥꉦꉧꉨꉩꉪꉫꉬꉭꉮꉯꉰꉱꉲꉳꉴꉵꉶꉷꉸꉹꉺꉻꉼꉽꉾꉿ</div>
    136. 

  136. <div class="line">ꊀꊁꊂꊃꊄꊅꊆꊇꊈꊉꊊꊋꊌꊍꊎꊏꊐꊑꊒꊓꊔꊕꊖꊗꊘꊙꊚꊛꊜꊝꊞꊟ</div>
    137. 

  137. <div class="line">ꊠꊡꊢꊣꊤꊥꊦꊧꊨꊩꊪꊫꊬꊭꊮꊯꊰꊱꊲꊳꊴꊵꊶꊷꊸꊹꊺꊻꊼꊽꊾꊿ</div>
    138. 

  138. <div class="line">ꋀꋁꋂꋃꋄꋅꋆꋇꋈꋉꋊꋋꋌꋍꋎꋏꋐꋑꋒꋓꋔꋕꋖꋗꋘꋙꋚꋛꋜꋝꋞꋟ</div>
    139. 

  139. <div class="line">ꋠꋡꋢꋣꋤꋥꋦꋧꋨꋩꋪꋫꋬꋭꋮꋯꋰꋱꋲꋳꋴꋵꋶꋷꋸꋹꋺꋻꋼꋽꋾꋿ</div>
    140. 

  140. <div class="line">ꌀꌁꌂꌃꌄꌅꌆꌇꌈꌉꌊꌋꌌꌍꌎꌏꌐꌑꌒꌓꌔꌕꌖꌗꌘꌙꌚꌛꌜꌝꌞꌟ</div>
    141. 

  141. <div class="line">ꌠꌡꌢꌣꌤꌥꌦꌧꌨꌩꌪꌫꌬꌭꌮꌯꌰꌱꌲꌳꌴꌵꌶꌷꌸꌹꌺꌻꌼꌽꌾꌿ</div>
    142. 

  142. <div class="line">ꍀꍁꍂꍃꍄꍅꍆꍇꍈꍉꍊꍋꍌꍍꍎꍏꍐꍑꍒꍓꍔꍕꍖꍗꍘꍙꍚꍛꍜꍝꍞꍟ</div>
    143. 

  143. <div class="line">ꍠꍡꍢꍣꍤꍥꍦꍧꍨꍩꍪꍫꍬꍭꍮꍯꍰꍱꍲꍳꍴꍵꍶꍷꍸꍹꍺꍻꍼꍽꍾꍿ</div>
    144. 

  144. <div class="line">ꎀꎁꎂꎃꎄꎅꎆꎇ</div>
    145. 

  145. </div>
    146. 

  146. </div>
    147. 

  147. </div>
    148. 

  148. <script src="support/text-orientation.js"></script>
    149. 

  149.