Style listStyleType 属性
 Style 对象
 Style 对象
定义和用法
listStyleType 属性设置或返回列表项标记的类型。
语法
设置 listStyleType 属性:
Object.style.listStyleType="value"
返回 listStyleType 属性:
Object.style.listStyleType
| 值 | 描述 | 
|---|---|
| armenian | 该标记是传统的亚美尼亚编号。 | 
| circle | 该标记是空心圆。 | 
| cjk-ideographic | 该标记是简单的表意数字。 | 
| decimal | 该标记是数字。这是 <ol> 的默认值。 | 
| decimal-leading-zero | 该标记是一个带有前导零的数字(01、02、03 等) | 
| disc | 该标记是实心圆。这是 <ul> 的默认值。 | 
| georgian | 该标记是传统的乔治亚编号。 | 
| hebrew | 该标记是传统的希伯来编号。 | 
| hiragana | 该标记是传统的平假名编号(a、i、u、e、o、ka、ki 等)。 | 
| hiragana-iroha | 该标记是传统的平假名 iroha 编号(i、ro、ha、ni、ho、he、to 等)。 | 
| inherit | listStyleType 属性的值从父元素继承。 | 
| katakana | 该标记是传统的片假名编号(A、I、U、E、O、KA、KI 等)。 | 
| katakana-iroha | 该标记是传统的片假名 iroha 编号(I、RO、HA、NI、HO、HE、TO 等)。 | 
| lower-alpha | 该标记是小写英文字母(a、b、c、d、e 等)。 | 
| lower-greek | 该标记是小写希腊字母(alpha、beta、gamma 等)。 | 
| lower-latin | 该标记是小写拉丁字母(a、b、c、d、e 等)。 | 
| lower-roman | 该字母是小写罗马数字(i、ii、iii、iv、v 等)。 | 
| none | 没有显示任何标记。 | 
| square | 该标记是实心方块。 | 
| upper-alpha | 该标记是大写英文字母(A、B、C、D、E 等)。 | 
| upper-latin | 该标记是大写拉丁字母(A、B、C、D、E 等)。 | 
| upper-roman | 该标记是大写罗马数字(I、II、III、IV、V 等)。 | 
浏览器支持





所有主要浏览器都支持 listStyleType 属性。
注意:IE9 和 Opera 11 不支持的属性值:cjk-ideographic、hebrew、hiragana、hiragana-iroha、katakana 和 katakana-iroha。
注意:IE8 如果指定 !DOCTYPE,只支持属性值:decimal-leading-zero、lower-greek、lower-latin、upper-latin、armenian、georgian 和 inherit。
实例
实例
更改列表项标记的类型:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>代码学院(codexy.cn)</title>
<script>
function displayResult(){
document.getElementById("ul1").style.listStyleType="square";
}
</script>
</head>
<body>
<ul id="ul1">
<li>Coffee</li>
<li>Tea</li>
<li>Water</li>
<li>Soda</li>
</ul>
<br>
<button type="button" onclick="displayResult()">修改列表项的标记类型</button>
 
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>代码学院(codexy.cn)</title>
<script>
function displayResult(){
document.getElementById("ul1").style.listStyleType="square";
}
</script>
</head>
<body>
<ul id="ul1">
<li>Coffee</li>
<li>Tea</li>
<li>Water</li>
<li>Soda</li>
</ul>
<br>
<button type="button" onclick="displayResult()">修改列表项的标记类型</button>
</body>
</html>
尝试一下 »

更多实例
所有不同的列表样式类型
查看所有不同的列表样式类型。
 Style 对象
 Style 对象			
						
			
 JavaScript 教程
JavaScript 教程 JavaScript 对象
JavaScript 对象 jQuery 教程
jQuery 教程 JSON 教程
JSON 教程 AngularJS 教程
AngularJS 教程 Angular 2 教程
Angular 2 教程 Vue.js 教程
Vue.js 教程 React 教程
React 教程 jQuery UI 教程
jQuery UI 教程 jQuery EasyUI 教程
jQuery EasyUI 教程 AJAX 教程
AJAX 教程 Highcharts 教程
Highcharts 教程 Google Maps API 教程
Google Maps API 教程 ES6 教程
ES6 教程 TypeScript教程
TypeScript教程 ES6 标准入门
ES6 标准入门