| <html> |
| <head> |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
| <style> |
| .test ol { padding-left: 300px; } |
| |
| /* |
| The following styles are ordered as they appear in section 4.5. of the |
| Draft 7 November 2002 draft of the CSS3 Lists module <http://www.w3.org/TR/css3-lists/#symbolic>. |
| */ |
| |
| ol.asterisks { list-style-type: asterisks; } |
| |
| ol.footnotes { list-style-type: footnotes; } |
| </style> |
| <script src="resources/dump-list.js"></script> |
| <script> |
| function runTest() |
| { |
| if (!window.testRunner) |
| return; |
| |
| testRunner.dumpAsText(); |
| filterListsWithReplacement(document.querySelectorAll(".test ol"), testListItemMarkerEqualsListItemText); |
| document.body.removeChild(document.getElementById("description")); // Remove description when running in DRT. |
| } |
| window.onload = runTest; |
| </script> |
| </head> |
| <body> |
| <h1>CSS3 Symbolic list-style-type</h1> |
| <p id="description">This tests that all of the symbolic CSS3 list-style-types are supported as per <a href="http://www.w3.org/TR/css3-lists/#symbolic">section 4.5 of the spec. CSS3 Lists module</a> (Draft 7 November 2002). This test PASSED if the list item matches its bullet for every list item (below). For example, for the asterisks symbolic system the second <li> (which corresponds to 2 in the standard ordering of the positive integers) should be rendered as: ** **</p> |
| <div class="test"> |
| <h2>asterisks</h2> |
| <ol class="asterisks"> |
| <li>*</li> |
| <li>**</li> |
| <li>***</li> |
| <li>****</li> |
| <li>*****</li> |
| <li>******</li> |
| <li>*******</li> |
| <li>********</li> |
| <li>*********</li> |
| <li>**********</li> |
| </ol> |
| <ol class="asterisks" start="0"> |
| <li>0</li> |
| </ol> |
| <ol class="asterisks" start="-2"> |
| <li>-2</li> |
| <li>-1</li> |
| </ol> |
| </div> |
| |
| <div class="test"> |
| <h2>footnotes</h2> |
| <ol class="footnotes"> |
| <li>*</li> |
| <li>⁑</li> |
| <li>†</li> |
| <li>‡</li> |
| <li>**</li> |
| <li>⁑⁑</li> |
| <li>††</li> |
| <li>‡‡</li> |
| <li>***</li> |
| <li>⁑⁑⁑</li> |
| <li>†††</li> |
| <li>‡‡‡</li> |
| <li>****</li> |
| <li>⁑⁑⁑⁑</li> |
| </ol> |
| <ol class="footnotes" start="0"> |
| <li>0</li> |
| </ol> |
| <ol class="footnotes" start="-2"> |
| <li>-2</li> |
| <li>-1</li> |
| </ol> |
| </div> |
| </body> |
| </html> |