disclosure-styles-ref.html 809 B

1234567891011121314151617181920212223242526272829303132333435
  1. <style type="text/css">
  2. @counter-style disclosure-closed2-ltr {
  3. system: cyclic;
  4. symbols: \25b8;
  5. suffix: ' ';
  6. }
  7. @counter-style disclosure-closed2-rtl {
  8. system: cyclic;
  9. symbols: \25c2;
  10. suffix: ' ';
  11. }
  12. @counter-style disclosure-open2 {
  13. system: cyclic;
  14. symbols: \25be;
  15. suffix: ' ';
  16. }
  17. .open { list-style-type: disclosure-open2; }
  18. .closed:dir(ltr) { list-style-type: disclosure-closed2-ltr; }
  19. .closed:dir(rtl) { list-style-type: disclosure-closed2-rtl; }
  20. ul {
  21. padding: 0;
  22. list-style-position: inside;
  23. }
  24. </style>
  25. <ul dir="ltr">
  26. <li class="closed">closed ltr
  27. <li class="open">open ltr
  28. </ul>
  29. <ul dir="rtl">
  30. <li class="closed">closed rtl
  31. <li class="open">open rtl
  32. </ul>
  33. <p dir="ltr">&#x25b8;&nbsp;closed ltr
  34. <p dir="rtl">&#x25c2;&nbsp;closed rtl