OLD | NEW |
| (Empty) |
1 <html> | |
2 | |
3 <!-- This page is used to test that CSS resources are retrieved correctly by the | |
4 WebPageSerializer::generateSnapshot method | |
5 --> | |
6 | |
7 <head> | |
8 | |
9 <link rel="stylesheet" type="text/css" href="link_styles.css" /> | |
10 | |
11 <style> | |
12 @import url('import_styles.css'); | |
13 | |
14 @font-face { | |
15 font-family: Chunkfive; | |
16 } | |
17 | |
18 #chunkfiveDiv { | |
19 font-family: Chunkfive, sans-serif; | |
20 } | |
21 </style> | |
22 | |
23 <style> | |
24 #divBlue { | |
25 background-image:url('blue_background.png'); | |
26 } | |
27 | |
28 ul { | |
29 list-style-image: url('ul-dot.png'); | |
30 } | |
31 | |
32 ol { | |
33 list-style-image: url('ol-dot.png'); | |
34 } | |
35 | |
36 </style> | |
37 | |
38 <script> | |
39 // Dynamically creates a CSS style. | |
40 function onLoad() { | |
41 var styleText = "#divPurple {background-image:url('purple_background.png')}"; | |
42 var div = document.getElementById('divPurple'); | |
43 var styleNode= document.createElement('style'); | |
44 styleNode.type= 'text/css'; | |
45 styleNode.media= 'screen'; | |
46 styleNode.appendChild(document.createTextNode(styleText)); | |
47 div.appendChild(styleNode); | |
48 } | |
49 </script> | |
50 </head> | |
51 | |
52 <body onload="onLoad()"> | |
53 | |
54 <!-- Text using an imported font --> | |
55 <div id='chunkfiveDiv'>This text uses the Chunkfive font.</div> | |
56 | |
57 <!-- Style is in linked file --> | |
58 <div id='divRed'> | |
59 This div has a red image as its background. | |
60 </div> | |
61 | |
62 <!-- Style is in a file imported in the linked file --> | |
63 <div id='divOrange'> | |
64 This div has a orange image as its background. | |
65 </div> | |
66 | |
67 <!-- Style is in an imported file --> | |
68 <div id='divYellow'> | |
69 This div has a yellow image as its background. | |
70 </div> | |
71 | |
72 <!-- Style is defined in a style section in the header --> | |
73 <div id='divBlue'> | |
74 This div has a blue image as its background. | |
75 </div> | |
76 | |
77 <!-- Style is inlined --> | |
78 <div id='divGreen' style="background-image:url('green_background.png')"> | |
79 This div has a green image as its background. | |
80 </div> | |
81 | |
82 <!-- Style id dynamically generated with JavaScript in the onload handler --> | |
83 <div id='divPurple'> | |
84 This div has a purple image as its background. | |
85 </div> | |
86 | |
87 Unordered list:<br> | |
88 <ul> | |
89 <li>Blue</li> | |
90 <li>Red</li> | |
91 <li>Yellow</li> | |
92 <li>Blue</li> | |
93 <li>Green</li> | |
94 <li>Red</li> | |
95 </ul> | |
96 <br> | |
97 | |
98 Ordered list:<br> | |
99 <ol> | |
100 <li>Blue</li> | |
101 <li>Red</li> | |
102 <li>Yellow</li> | |
103 <li>Blue</li> | |
104 <li>Green</li> | |
105 <li>Red</li> | |
106 </ol> | |
107 | |
108 </body> | |
109 | |
110 </html> | |
OLD | NEW |