CSS list-style-type 属性
关于有序列表type 属性兼容，CSS的list-style-type属性样式可以解决有序列表<ol> 元素的 type 属性兼容问题。
有序列表的项目符号的类型，包括1，A，a，I，i，常用的有阿拉伯数字1,2,3，英文字母a,b,c，大写英文字母A,B,C，罗马字母i, ii, iii, iv，大写罗马字母I, II, III, IV
前面说过，尽管不赞成使用 type 属性，不过所有浏览器都支持 type 属性。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS的list-style-type</title>
<style type="text/css">
ul.circle {list-style-type:circle}
ul.square {list-style-type:square}
ol.upper-roman {list-style-type:upper-roman}
ol.lower-alpha {list-style-type:lower-alpha}
</style>
</head>
<body>
<p>Type circle:</p>
<ul class="circle">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>
<p>Type square:</p>
<ul class="square">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>
<p>Type upper-roman:</p>
<ol class="upper-roman">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ol>
<p>Type lower-alpha:</p>
<ol class="lower-alpha">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ol>
</body>
</html>通过CSS设置不同的列表样式，从而达到有序列表<ol>的type属性相同的效果。
【有序列表和无序列表均可以应用】
兼容：所有浏览器都支持 list-style-type 属性。
| none | 无标记。 |
| disc | 默认。标记是实心圆。 |
| circle | 标记是空心圆。 |
| square | 标记是实心方块。 |
| decimal | 标记是数字。 |
| decimal-leading-zero | 0开头的数字标记。(01, 02, 03, 等。) |
| lower-roman | 小写罗马数字(i, ii, iii, iv, v, 等。) |
| upper-roman | 大写罗马数字(I, II, III, IV, V, 等。) |
| lower-alpha | 小写英文字母The marker is lower-alpha (a, b, c, d, e, 等。) |
| upper-alpha | 大写英文字母The marker is upper-alpha (A, B, C, D, E, 等。) |
| lower-greek | 小写希腊字母(alpha, beta, gamma, 等。) |
| lower-latin | 小写拉丁字母(a, b, c, d, e, 等。) |
| upper-latin | 大写拉丁字母(A, B, C, D, E, 等。) |
| hebrew | 传统的希伯来编号方式 |
| armenian | 传统的亚美尼亚编号方式 |
| georgian | 传统的乔治亚编号方式(an, ban, gan, 等。) |
| cjk-ideographic | 简单的表意数字 |
| hiragana | 标记是：a, i, u, e, o, ka, ki, 等。（日文片假名） |
| katakana | 标记是：A, I, U, E, O, KA, KI, 等。（日文片假名） |
| hiragana-iroha | 标记是：i, ro, ha, ni, ho, he, to, 等。（日文片假名） |
| katakana-iroha | 标记是：I, RO, HA, NI, HO, HE, TO, 等。（日文片假名） |
拓展：有序列表<ol>的新属性
<ol> 有序列表
【H5新属性】
①reversed---规定列表顺序为降序。(9,8,7...)
兼容：目前只有 Chrome 和 Safari 6 支持 reversed 属性。
<ol reversed> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ol>
②start---规定有序列表的起始值
兼容：尽管不赞成使用 start 属性，不过所有浏览器都支持 start 属性。注释：目前，仍然没有 start 属性的 CSS 替代方案。
<ol start="5" reversed>
<li>HTML</li>
<li>XHTML</li>
<li>CSS</li>
</ol>③type----规定有序列表的项目符号的类型，包括1，A，a，I，i
注意：尽管不赞成使用 type 属性，不过所有浏览器都支持 type 属性
<ol type="I"> <li>HTML</li> <li>XHTML</li> <li>CSS</li> </ol>
.
相关推荐
jiedinghui 2020-10-25
Ladyseven 2020-10-22
zuncle 2020-09-28
xiaohuli 2020-09-02
葉無聞 2020-09-01
nicepainkiller 2020-08-20
AlisaClass 2020-08-09
myloveqiqi 2020-08-09
buttonChan 2020-08-02
drdrsky 2020-07-29
Ladyseven 2020-07-25
nicepainkiller 2020-07-24
AlisaClass 2020-07-19
hellowzm 2020-07-19
background-color: blue;background-color: yellow;<input type="button" value="变蓝" @click="changeColorT
昔人已老 2020-07-19
骆驼的自白 2020-07-18
lanzhusiyu 2020-07-19
hellowzm 2020-07-19
CSSEIKOCS 2020-07-18