HTML <ul> 标签简介

来源：互联网发布：中学生编程大赛编辑：程序博客网时间：2024/06/05 08:13

1、简介

<ul> 标签用于定义无序列表。

2、属性
2.1 标准属性

id, class, title, style, dir, lang, xml:lang

2.2 可选属性

DTD 指示此属性允许在哪种 DTD 中使用。S=Strict, T=Transitional, F=Frameset.

属性值描述DTDcompactcompact

不赞成使用。请使用样式取代它。

规定列表呈现的效果比正常情况更小巧。

TFtype

disc
square
circle

不赞成使用。请使用样式取代它。

规定列表的项目符号的类型。

2.3 事件属性

onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

3、示例

<html>
<body>

<h4>Disc 项目符号列表：</h4>
<ul type="disc">
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ul>

<h4>Circle 项目符号列表：</h4>
<ul type="circle">
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ul>

<h4>Square 项目符号列表：</h4>
<ul type="square">
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ul>

<h4>一个嵌套列表：</h4>
<ul>
<li>咖啡</li>
<li>茶
<ul>
<li>红茶</li>
<li>绿茶
<ul>
<li>中国茶</li>
<li>非洲茶</li>
</ul>
</li>
</ul>
</li>
<li>牛奶</li>
</ul>

</body>
</html>

代码运行结果：

Disc 项目符号列表：

苹果
香蕉
柠檬
桔子

Circle 项目符号列表：

苹果
香蕉
柠檬
桔子

Square 项目符号列表：

苹果
香蕉
柠檬
桔子

一个嵌套列表：

咖啡
茶
- 红茶
- 绿茶
  - 中国茶
  - 非洲茶
牛奶

参考文献：http://www.w3school.com.cn/tags/tag_ul.asp