当前阅读教程:CSS入门到精通 > 列表项标记的类型 list-style-type属性 | |||||||||||||||||||||||||||||||||||||||||||||||||||||
阅读(22555525) 收藏 赞(5685) 分享 | |||||||||||||||||||||||||||||||||||||||||||||||||||||
上一篇: 列表项目标记位置 list-style-position属性 | 下一篇: 所有列表list-style属性 | ||||||||||||||||||||||||||||||||||||||||||||||||||||
浏览器支持表格中的数字表示支持该属性的第一个浏览器版本号。 属性定义及使用说明list-style-type 属性设置列表项标记的类型。
属性值
实例代码<!doctype html> <html> <head> <meta charset="utf-8"> <title>列表项标记的类型 list-style-typ属性</title> <!--定义内部样式--> <style> .none {list-style-type: none} .disc {list-style-type: disc} .circle {list-style-type: circle} .square {list-style-type: square} .decimal {list-style-type: decimal} .decimal-leading-zero {list-style-type: decimal-leading-zero} .lower-roman {list-style-type: lower-roman} .upper-roman {list-style-type: upper-roman} .lower-alpha {list-style-type: lower-alpha} .upper-alpha {list-style-type: upper-alpha} .lower-greek {list-style-type: lower-greek} .lower-latin {list-style-type: lower-latin} .upper-latin {list-style-type: upper-latin} .hebrew {list-style-type: hebrew} .armenian {list-style-type: armenian} .georgian {list-style-type: georgian} .cjk-ideographic {list-style-type: cjk-ideographic} .hiragana {list-style-type: hiragana} .katakana {list-style-type: katakana} .hiragana-iroha {list-style-type: hiragana-iroha} .katakana-iroha {list-style-type: katakana-iroha} </style> </head> <body> <!-- 无标记 --> <ul> <li>"none" 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 默认。标记是实心圆 --> <ul> <li>Disc 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 标记是空心圆 --> <ul> <li>Circle 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 标记是实心方块 --> <ul> <li>Square 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 标记是数字 --> <ul> <li>Decimal 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 0开头的数字标记。(01, 02, 03, 等。) --> <ul> <li>Decimal-leading-zero 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 小写罗马数字(i, ii, iii, iv, v, 等。) --> <ul> <li>Lower-roman 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 大写罗马数字(I, II, III, IV, V, 等。) --> <ul> <li>Upper-roman 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 小写英文字母The marker is lower-alpha (a, b, c, d, e, 等。) --> <ul> <li>Lower-alpha 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 大写英文字母The marker is upper-alpha (A, B, C, D, E, 等。) --> <ul> <li>Upper-alpha 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 小写希腊字母(alpha, beta, gamma, 等。) --> <ul> <li>Lower-greek 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 小写拉丁字母(a, b, c, d, e, 等。) --> <ul> <li>Lower-latin 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 大写拉丁字母(A, B, C, D, E, 等。) --> <ul> <li>Upper-latin 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 传统的希伯来编号方式 --> <ul> <li>Hebrew 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 传统的亚美尼亚编号方式 --> <ul> <li>Armenian 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 传统的乔治亚编号方式(an, ban, gan, 等。) --> <ul> <li>Georgian 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 简单的表意数字 --> <ul> <li>Cjk-ideographic 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 标记是:a, i, u, e, o, ka, ki, 等。(日文片假名) --> <ul> <li>Hiragana 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 标记是:A, I, U, E, O, KA, KI, 等。(日文片假名) --> <ul> <li>Katakana 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!-- 标记是:i, ro, ha, ni, ho, he, to, 等。(日文片假名) --> <ul> <li>Hiragana-iroha 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
<!--标记是:I, RO, HA, NI, HO, HE, TO, 等。(日文片假名) --> <ul> <li>Katakana-iroha 类型</li> <li>茶</li> <li>可口可乐</li> </ul>
</body> </html> 效果图 |
|||||||||||||||||||||||||||||||||||||||||||||||||||||
上一篇: 列表项目标记位置 list-style-position属性 | 下一篇: 所有列表list-style属性 |