| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <meta http-equiv="content-type" content="text/html; charset=utf-8"> | 4 <meta http-equiv="content-type" content="text/html; charset=utf-8"> |
| 5 <title>Vertical text metrics test</title> | 5 <title>Vertical text metrics test</title> |
| 6 <script> | 6 <script> |
| 7 function print(message) | 7 function print(message) |
| 8 { | 8 { |
| 9 var paragraph = document.createElement("li"); | 9 var paragraph = document.createElement("li"); |
| 10 paragraph.appendChild(document.createTextNode(message)); | 10 paragraph.appendChild(document.createTextNode(message)); |
| (...skipping 13 matching lines...) Expand all Loading... |
| 24 } | 24 } |
| 25 </script> | 25 </script> |
| 26 <style> | 26 <style> |
| 27 body { | 27 body { |
| 28 font-family: "HiraMinPro-W3"; | 28 font-family: "HiraMinPro-W3"; |
| 29 font-size: 16pt; | 29 font-size: 16pt; |
| 30 } | 30 } |
| 31 #horizontal_TB { | 31 #horizontal_TB { |
| 32 -webkit-writing-mode: horizontal-tb; | 32 -webkit-writing-mode: horizontal-tb; |
| 33 } | 33 } |
| 34 #horizontal_BT { | |
| 35 -webkit-writing-mode: horizontal-bt; | |
| 36 } | |
| 37 #vertical_RL { | 34 #vertical_RL { |
| 38 -webkit-writing-mode: vertical-rl; | 35 -webkit-writing-mode: vertical-rl; |
| 39 } | 36 } |
| 40 #vertical_LR { | 37 #vertical_LR { |
| 41 -webkit-writing-mode: vertical-lr; | 38 -webkit-writing-mode: vertical-lr; |
| 42 } | 39 } |
| 43 #horizontal_TB_complex { | 40 #horizontal_TB_complex { |
| 44 -webkit-writing-mode: horizontal-tb; | 41 -webkit-writing-mode: horizontal-tb; |
| 45 text-rendering: optimizelegibility; | 42 text-rendering: optimizelegibility; |
| 46 } | 43 } |
| 47 #horizontal_BT_complex { | |
| 48 -webkit-writing-mode: horizontal-bt; | |
| 49 text-rendering: optimizelegibility; | |
| 50 } | |
| 51 #vertical_RL_complex { | 44 #vertical_RL_complex { |
| 52 -webkit-writing-mode: vertical-rl; | 45 -webkit-writing-mode: vertical-rl; |
| 53 text-rendering: optimizelegibility; | 46 text-rendering: optimizelegibility; |
| 54 } | 47 } |
| 55 #vertical_LR_complex { | 48 #vertical_LR_complex { |
| 56 -webkit-writing-mode: vertical-lr; | 49 -webkit-writing-mode: vertical-lr; |
| 57 text-rendering: optimizelegibility; | 50 text-rendering: optimizelegibility; |
| 58 } | 51 } |
| 59 </style> | 52 </style> |
| 60 </head> | 53 </head> |
| 61 <body onload="test()"> | 54 <body onload="test()"> |
| 62 <p>Simple text path</p> | 55 <p>Simple text path</p> |
| 63 <span id="horizontal_TB">string「あ、変っ!」。</span><br> | 56 <span id="horizontal_TB">string「あ、変っ!」。</span><br> |
| 64 <span id="horizontal_BT">string「あ、変っ!」。</span><br> | |
| 65 <span id="vertical_RL">string「あ、変っ!」。</span><br> | 57 <span id="vertical_RL">string「あ、変っ!」。</span><br> |
| 66 <span id="vertical_LR">string「あ、変っ!」。</span><br> | 58 <span id="vertical_LR">string「あ、変っ!」。</span><br> |
| 67 <br> | 59 <br> |
| 68 <hr> | 60 <hr> |
| 69 <p>Complex text path</p> | 61 <p>Complex text path</p> |
| 70 <span id="horizontal_TB_complex">string「あ、変っ!」。</span><br> | 62 <span id="horizontal_TB_complex">string「あ、変っ!」。</span><br> |
| 71 <span id="horizontal_BT_complex">string「あ、変っ!」。</span><br> | |
| 72 <span id="vertical_RL_complex">string「あ、変っ!」。</span><br> | 63 <span id="vertical_RL_complex">string「あ、変っ!」。</span><br> |
| 73 <span id="vertical_LR_complex">string「あ、変っ!」。</span><br> | 64 <span id="vertical_LR_complex">string「あ、変っ!」。</span><br> |
| 74 <br> | 65 <br> |
| 75 <hr> | 66 <hr> |
| 76 <p><ol id=console></ol></p> | 67 <p><ol id=console></ol></p> |
| 77 </body> | 68 </body> |
| 78 </html> | 69 </html> |
| OLD | NEW |