dom/tests/js/style1.html@b8a032363ba2
dom/tests/js/style1.html
Thu, 22 Jan 2015 13:21:57 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Thu, 22 Jan 2015 13:21:57 +0100
- branch
- TOR_BUG_9701
- changeset 15
- b8a032363ba2
- permissions
- -rw-r--r--
Incorporate requested changes from Mozilla in review:
https://bugzilla.mozilla.org/show_bug.cgi?id=1123480#c6
1 <html>
2 <head>
3 <title>Example 0</title>
4 <style title="hello" media="screen, print">
5 :first-letter { color: green; }
6 a#id.foo:visited:first-line { color: red; }
7 a#id.foo:first-line { color: red; }
8 a#id.foo:visited { color: red; }
9 a#id:first-line { color: red; }
10 a#id:visited { color: red; }
11 a:first-line { color: red; }
12 a:visited { color: red; }
13 a:visited:first-line { color: red; }
14 a:visited:visited { color: red; }
15 a:first-line:visited { color: red; }
16 :active { color: blue; }
17 P.first:first-line { color: blue; }
18 P.first:first-letter { color: yellow; }
19 </style>
20 </head>
22 <body bgcolor="#FFFFFF" text="#000000">
23 <h1>Example 0: Basic HTML Text Styles</h1>
24 <p><br></p>
25 <h2>Formatted Text</h2>
26 <p>This is a basic paragraph with <b>bold</b>, <i>italic</i> and <i>bold-italic
27 </i> text. It also includes <font color="#FF0000">red</font>, <font color="#00FF00">green</font>
28 and <font color="#0000FF">blue</font> text. It has <s>strikethru</s> and <u>underline</u>.
29 <u> </u></p>
30 <p>This is a paragraph with font variations: <b><font face="Arial, Helvetica, sans-serif">Arial,</font></b><font face="Arial, Helvetica, sans-serif">
31 <i><font face="Verdana, Arial, Helvetica, sans-serif">Verdana</font>,</i> <font face="co">COURIER,
32 <font face="Times New Roman, Times, serif">Times New Roman.</font></font></font></p>
33 <p class="first"><font size=7>Font size=7, </font><font size=6>Font size=6, </font><font size=5>Font
34 size=5, </font><font size=4>Font size=4, </font><font size=3>Font size=3, </font><font size=2>Font
35 size=2, </font><font size=1>Font size=1, </font><font point-size=24 font-weight=700>Font
36 point-size=24 font-weight=700</font></p>
37 <p><THREED>3D Text. 3D Text. 3D Text. 3D Text. 3D Text. </THREED><br>
38 <h2><br>
39 </h2>
40 <h2>Listings</h2>
41 <h3>Bulleted List </h3>
42 <ul>
43 <li>One</li>
44 <li>Two
45 <ul>
46 <li>Apples</li>
47 <li>Oranges</li>
48 <li>Bananas</li>
49 </ul>
50 </li>
51 <li>Three</li>
52 </ul>
53 <br>
54 <h3>Numbered List </h3>
55 <ol>
56 <li>One</li>
57 <li>Two
58 <ol>
59 <li>Apples</li>
60 <li>Oranges</li>
61 <li>Bananas</li>
62 </ol>
63 </li>
64 <li>Three</li>
65 </ol>
66 <h2>Justified Text</h2>
67 <p>This paragraph is aligned <b>left</b>. This paragraph is aligned <b>left</b>.
68 This paragraph is aligned <b>left</b>. This paragraph is aligned <b>left</b>.
69 This paragraph is aligned <b>left</b>. This paragraph is aligned <b>left</b>.
70 This paragraph is aligned <b>left</b>. </p>
71 <p align="RIGHT">This paragarph is aligned <b>right. </b>This paragarph is aligned
72 <b>right. </b>This paragarph is aligned <b>right. </b>This paragarph is aligned
73 <b>right. </b>This paragarph is aligned <b>right. </b>This paragarph is aligned
74 <b>right. </b>This paragarph is aligned <b>right. </b><b> </b>This paragarph
75 is aligned <b>right. </b></p>
76 <p align="CENTER">This paragraph is aligned <b>center</b>. This paragraph is aligned
77 <b>center</b>.This paragraph is aligned <b>center</b>.This paragraph is aligned
78 <b>center</b>.This paragraph is aligned <b>center</b>.This paragraph is aligned
79 <b>center</b>.This paragraph is aligned <b>center</b>.This paragraph is aligned
80 <b>center</b>.This paragraph is aligned <b>center</b>.This paragraph is aligned
81 <b>center</b>.</p>
82 <p></p>
83 <p> </p>
84 <script>
85 var r = 0, g = 0, b = 0;
86 var h = document.documentElement.childNodes[1].childNodes[1];
87 var sheet = document.styleSheets[0];
88 var rule = sheet.cssRules[0];
89 var size = 10;
91 function changeColor() {
92 r += 5;
93 g += 2;
94 b += 3;
95 r %= 255;
96 g %= 255;
97 b %= 255;
98 size += 1;
99 if (size > 48) {
100 size = 10;
101 }
103 h.style.backgroundColor = "rgb(" + r + "," + g + "," + b + ")";
104 rule.style.color = "rgb(" + r + "," + g + "," + b + ")";
105 rule.style.fontSize = size + "pt";
106 }
108 setInterval(changeColor, 40);
109 </script>
110 </body>
111 </html>
