third_party/WebKit/LayoutTests/fast/ruby/ruby-first-letter.html

   1 <!doctype html>
   2 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   3 <script>
   4   function runTest()
   5   {
   6     var child = document.createElement('rb');
   7     child.textContent = 'content';
   8     document.querySelector('rbc').appendChild(child)
   9
  10     child = document.createElement('rt');
  11     child.textContent = 'content';
  12     document.querySelector('.reading').appendChild(child);
  13
  14     child = document.createTextNode('text');
  15     var rb = document.querySelector('.rb');
  16     rb.insertBefore(child, rb.firstChild);
  17
  18     child = document.createTextNode('text');
  19     var rt = document.querySelector('.rt');
  20     rt.insertBefore(child, rt.firstChild);
  21
  22     child = document.createElement('rt');
  23     child.innerText = 'Test';
  24     document.querySelector('#ruby').appendChild(document.createTextNode('T'));
  25     document.querySelector('#ruby').appendChild(child);
  26   }
  27   onload = runTest;
  28 </script>
  29 <style>
  30   ruby:first-letter { font-size: 20px; color: red; }
  31   rt:first-letter { font-size: 20px; color: blue; }
  32   rb:first-letter { font-size: 20px; color: green; }
  33   rbc:first-letter { font-size: 20px; color: purple; }
  34   rtc:first-letter { font-size: 20px; color: orange; }
  35   rp:first-letter { font-size: 20px; color: brown;}
  36 </style>
  37
  38 <div>This test is verifying that adding content that uses first letter into
  39 ruby tags works correctly.</div>
  40
  41 <p>&lt;ruby&gt; is defined in the
  42 <ruby id='ruby'>H<rt>Hyper</rt>T<rt>Text</rt>M<rt>Markup</rt>L<rt>Language</rt>5<rt>Level
  43 5</rt></ruby> specs.</p>
  44
  45 <ruby xml:lang="ja">
  46   <rbc>
  47     <rb class='rb'>斎</rb>
  48     <rb>藤</rb>
  49     <rb>信</rb>
  50     <rb>男</rb>
  51   </rbc>
  52   <rtc class="reading">
  53     <rt class='rt'>さい</rt>
  54     <rt>とう</rt>
  55     <rt>のぶ</rt>
  56     <rt>お</rt>
  57   </rtc>
  58   <rtc class="annotation">
  59     <rt rbspan="4" xml:lang="en">W3C Associate Chairman</rt>
  60   </rtc>
  61
  62   <rp>(</rp>
  63   <rt>aaa</rt>
  64   <rp>)</rp>
  65 </ruby>