presentational-hints-002.html (2672B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <head> 4 <meta charset="utf-8"/> 5 <title>presentational hints (dynamic)</title> 6 <link rel="help" href="https://w3c.github.io/mathml-core/#attributes-common-to-html-and-mathml-elements"> 7 <link rel="help" href="https://w3c.github.io/mathml-core/#css-styling"> 8 <!--link rel="help" href="https://w3c.github.io/mathml-core/#double-struck-mappings"--> 9 <link rel="help" href="https://w3c.github.io/mathml-core/#legacy-mathml-style-attributes"> 10 <link rel="help" href="https://w3c.github.io/mathml-core/#math-auto-transform"> 11 <link rel="help" href="https://w3c.github.io/mathml-core/#the-displaystyle-and-scriptlevel-attributes"> 12 <link rel="help" href="https://w3c.github.io/mathml-core/#the-mathvariant-attribute"> 13 <link rel="match" href="presentational-hints-002-ref.html"/> 14 <link rel="stylesheet" href="/fonts/ahem.css"> 15 <meta name="assert" content="Verify dynamically setting attributes mapped to style."> 16 <style> 17 math { 18 font: 25px/1 Ahem; 19 } 20 @font-face { 21 font-family: Italic; 22 src: url("/fonts/math/mathvariant-italic.woff"); 23 } 24 </style> 25 <script> 26 window.addEventListener("load", function() { 27 // force initial layout so we're sure what we're testing against 28 document.documentElement.getBoundingClientRect(); 29 30 document.getElementById("dir").setAttribute("dir", "rtl"); 31 document.getElementById("mathcolor").setAttribute("mathcolor", "green"); 32 document.getElementById("mathbackground").setAttribute("mathbackground", "green"); 33 document.getElementById("mathsize").setAttribute("mathsize", "300%"); 34 document.getElementById("mathvariant").setAttribute("mathvariant", "normal"); 35 document.getElementById("displaystyle").setAttribute("displaystyle", "true"); 36 document.getElementById("scriptlevel").setAttribute("scriptlevel", "-1"); 37 38 document.documentElement.classList.remove('reftest-wait'); 39 }); 40 </script> 41 </head> 42 <body> 43 <p>dir: 44 <math id="dir"> 45 <mtext>X</mtext> 46 <mtext>p</mtext> 47 </math> 48 </p> 49 <p>mathcolor: 50 <math id="mathcolor"> 51 <mtext>X</mtext> 52 <mtext>p</mtext> 53 </math> 54 </p> 55 <p>mathbackground: 56 <math id="mathbackground"> 57 <mtext>X</mtext> 58 <mtext>p</mtext> 59 </p> 60 <p>mathsize: 61 <math> 62 <mtext id="mathsize">X</mtext> 63 </math> 64 </p> 65 <p>mathvariant: 66 <math style="font-family: Italic"> 67 <mi id="mathvariant">X</mi> 68 </math> 69 </p> 70 <p>displaystyle: 71 <math id="displaystyle"> 72 <munder> 73 <mo movablelimits="true">X</mo> 74 <mo>X</mo> 75 </munder> 76 </math> 77 </p> 78 <p>scriptlevel: 79 <math> 80 <mtext id="scriptlevel">X</mtext> 81 </math> 82 </p> 83 </body> 84 </html>