ruby-autohide-002.html (1297B)
1 <!DOCTYPE html> 2 <html lang="ja"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>CSS Test: Autohide ruby annotations which are identical to their bases</title> 6 <link rel="author" title="Xidorn Quan" href="mailto:quanxunzhen@gmail.com"> 7 <link rel="help" href="http://www.w3.org/TR/css-ruby-1/#autohide"> 8 <link rel="match" href="ruby-autohide-002-ref.html"> 9 <script> 10 window.onload = function() { 11 // Force a reflow before changes. 12 document.body.clientWidth; 13 var elems = document.querySelectorAll('[data-content]'); 14 for (var i = 0; i < elems.length; i++) { 15 elems[i].textContent = elems[i].dataset.content; 16 } 17 }; 18 </script> 19 </head> 20 <body> 21 <p><ruby> 22 <rb>振</rb><rb>り</rb><rb>仮</rb><rb>名</rb> 23 <rt>ふ</rt><rt data-content="ri">り</rt><rt>が</rt><rt>な</rt> 24 </ruby></p> 25 <p><ruby> 26 <rb>振</rb><rb data-content="ri">り</rb><rb>仮</rb><rb>名</rb> 27 <rt>ふ</rt><rt>り</rt><rt>が</rt><rt>な</rt> 28 </ruby></p> 29 <p><ruby> 30 <rb>振</rb><rb>り</rb><rb>仮</rb><rb>名</rb> 31 <rt>ふ</rt><rt data-content="り">ri</rt><rt>が</rt><rt>な</rt> 32 </ruby></p> 33 <p><ruby> 34 <rb>振</rb><rb data-content="り">ri</rb><rb>仮</rb><rb>名</rb> 35 <rt>ふ</rt><rt>り</rt><rt>が</rt><rt>な</rt> 36 </ruby></p> 37 </body> 38 </html>