third_party/WebKit/LayoutTests/fast/text/international/vertical-text-metrics-test.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <meta http-equiv="content-type" content="text/html; charset=utf-8">
   5 <title>Vertical text metrics test</title>
   6 <script>
   7 function print(message)
   8 {
   9     var paragraph = document.createElement("li");
  10     paragraph.appendChild(document.createTextNode(message));
  11     document.getElementById("console").appendChild(paragraph);
  12 }
  13 function test()
  14 {
  15     if (window.testRunner)
  16         testRunner.dumpAsText();
  17
  18     var pElems = document.getElementsByTagName("span");
  19     for ( i = 0 ; i < pElems.length ; ++i )
  20     {
  21         var elem = pElems[i];
  22         print("width=" + elem.offsetWidth);
  23     }
  24 }
  25 </script>
  26 <style>
  27 body {
  28     font-family: "HiraMinPro-W3";
  29     font-size: 16pt;
  30 }
  31 #horizontal_TB {
  32     -webkit-writing-mode: horizontal-tb;
  33 }
  34 #horizontal_BT {
  35     -webkit-writing-mode: horizontal-bt;
  36 }
  37 #vertical_RL {
  38     -webkit-writing-mode: vertical-rl;
  39 }
  40 #vertical_LR {
  41     -webkit-writing-mode: vertical-lr;
  42 }
  43 #horizontal_TB_complex {
  44     -webkit-writing-mode: horizontal-tb;
  45     text-rendering: optimizelegibility;
  46 }
  47 #horizontal_BT_complex {
  48     -webkit-writing-mode: horizontal-bt;
  49     text-rendering: optimizelegibility;
  50 }
  51 #vertical_RL_complex {
  52     -webkit-writing-mode: vertical-rl;
  53     text-rendering: optimizelegibility;
  54 }
  55 #vertical_LR_complex {
  56     -webkit-writing-mode: vertical-lr;
  57     text-rendering: optimizelegibility;
  58 }
  59 </style>
  60 </head>
  61 <body onload="test()">
  62 <p>Simple text path</p>
  63 <span id="horizontal_TB">string「あ、変っ！」。</span><br>
  64 <span id="horizontal_BT">string「あ、変っ！」。</span><br>
  65 <span id="vertical_RL">string「あ、変っ！」。</span><br>
  66 <span id="vertical_LR">string「あ、変っ！」。</span><br>
  67 <br>
  68 <hr>
  69 <p>Complex text path</p>
  70 <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>
  73 <span id="vertical_LR_complex">string「あ、変っ！」。</span><br>
  74 <br>
  75 <hr>
  76 <p><ol id=console></ol></p>
  77 </body>
  78 </html>