CSS
CSS 列表
所有不同的列表项标记 - 这个例子演示了所有不同的CSS列表项标记。
源代码:
点击运行 »
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> ul.a { list-style-type: circle; } ul.b { list-style-type: disc; } ul.c { list-style-type: square; } ol.d { list-style-type: armenian; } ol.e { list-style-type: cjk-ideographic; } ol.f { list-style-type: decimal; } ol.g { list-style-type: decimal-leading-zero; } ol.h { list-style-type: georgian; } ol.i { list-style-type: hebrew; } ol.j { list-style-type: hiragana; } ol.k { list-style-type: hiragana-iroha; } ol.l { list-style-type: katakana; } ol.m { list-style-type: katakana-iroha; } ol.n { list-style-type: lower-alpha; } ol.o { list-style-type: lower-greek; } ol.p { list-style-type: lower-latin; } ol.q { list-style-type: lower-roman; } ol.r { list-style-type: upper-alpha; } ol.s { list-style-type: upper-latin; } ol.t { list-style-type: upper-roman; } ol.u { list-style-type: none; } ol.v { list-style-type: inherit; } </style> </head> <body> <ul class="a"> <li>Circle type</li> <li>Tea</li> <li>Coca Cola</li> </ul> <ul class="b"> <li>Disc type</li> <li>Tea</li> <li>Coca Cola</li> </ul> <ul class="c"> <li>Square type</li> <li>Tea</li> <li>Coca Cola</li> </ul> <ol class="d"> <li>Armenian type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="e"> <li>Cjk-ideographic type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="f"> <li>Decimal type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="g"> <li>Decimal-leading-zero type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="h"> <li>Georgian type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="i"> <li>Hebrew type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="j"> <li>Hiragana type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="k"> <li>Hiragana-iroha type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="l"> <li>Katakana type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="m"> <li>Katakana-iroha type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="n"> <li>Lower-alpha type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="o"> <li>Lower-greek type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="p"> <li>Lower-latin type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="q"> <li>Lower-roman type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="r"> <li>Upper-alpha type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="s"> <li>Upper-latin type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="t"> <li>Upper-roman type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="u"> <li>None type</li> <li>Tea</li> <li>Coca Cola</li> </ol> <ol class="v"> <li>inherit type</li> <li>Tea</li> <li>Coca Cola</li> </ol> </body> </html>
运行结果:
点击运行 »