| <!DOCTYPE html> |
| <meta charset="utf-8"> |
| <title>CSS Lists: test the change of list-style-type</title> |
| <link rel="match" href="change-list-style-type-001-ref.html"> |
| <link rel=help href="https://www.w3.org/TR/CSS22/generate.html#lists"> |
| <link rel=help href="https://bugs.chromium.org/p/chromium/issues/detail?id=966750"> |
| <style type="text/css"> |
| .inside { |
| list-style-position: inside; |
| } |
| |
| .none2symbol { |
| list-style-type: none; |
| } |
| |
| .symbol2none { |
| list-style-type: square; |
| } |
| |
| .symbol2symbol { |
| list-style-type: disc; |
| } |
| |
| .symbol2ordinal { |
| list-style-type: disc; |
| } |
| |
| .ordinal2ordinal { |
| list-style-type: upper-roman; |
| } |
| </style> |
| |
| <ul class="inside"><li class="none2symbol">inside: none to square</li></ul> |
| <ul><li class="none2symbol">outside: none to square</li></ul> |
| |
| <ul class="inside"><li class="symbol2none">inside: square to none</li></ul> |
| <ul><li class="symbol2none">outside: square to none</li></ul> |
| |
| <ul class="inside"><li class="symbol2symbol">inside: disc to square</li></ul> |
| <ul><li class="symbol2symbol">outside: disc to square</li></ul> |
| |
| <ul class="inside"><li class="symbol2ordinal">inside: disc to upper-roman</li></ul> |
| <ul><li class="symbol2ordinal">outside: disc to upper-roman</li></ul> |
| |
| <ul class="inside"><li class="ordinal2ordinal">inside: upper-roman to decimal</li></ul> |
| <ul><li class="ordinal2ordinal">outside: upper-roman to decimal</li></ul> |
| |
| <script> |
| document.body.offsetLeft; |
| </script> |
| |
| <style type="text/css"> |
| .none2symbol { |
| list-style-type: square; |
| } |
| |
| .symbol2none { |
| list-style-type: none; |
| } |
| |
| .symbol2symbol { |
| list-style-type: square; |
| } |
| |
| .symbol2ordinal { |
| list-style-type: upper-roman; |
| } |
| |
| .ordinal2ordinal { |
| list-style-type: decimal; |
| } |
| </style> |