HTML <ul> 标签
HTML <ul> 元素(或称 HTML 无序列表元素)表示一个内可含多个元素的无序列表或项目符号列表。
实例
无序 HTML 列表:
<!DOCTYPE html><html><body><h1>ul 元素</h1><ul><li>咖啡</li><li>茶</li><li>牛奶</li></ul></body></html>
定义和用法
<ul> 标签定义无序列表。
<ul> 元素用来将没有数字顺序的一组数据进行分组。举个例子,无序列表的列表项通常通过一个字符进行装饰,这些字符的形式可以是点,圆乃至方形.虽然这个字符没有直接在页面上定义,但是可以用与之相关的 CSS 对其进行操作,例如使用 list-style-type 属性。
在 <ol> 和 <ul> 元素中,嵌套列表没有深度和嵌套顺序的限制。
<ol> 和 <ul> 元素二者都代表一组数据,不过它们彼此是有区别的,ol元素中的顺序是有意义的。如果想确定你到底需要使用哪一个列表元素,你可以试着去改变数据的顺序。如果想表达的语义改变了,你就需要使用ol元素,否则你该使用ul元素。
浏览器支持
| 元素 | |||||
|---|---|---|---|---|---|
| <ul> | Yes | Yes | Yes | Yes | Yes |
所有主流浏览器都支持 <ul> 标签。
HTML 与 XHTML 之间的差异
在 HTML 4.01 中,ul 元素的 "compact" 和 "type" 属性是不建议使用的。
在 XHTML 1.0 Strict DTD 中,不支持 ul 元素的 "compact" 和 "type" 属性。
可选的属性
| 属性 | 值 | 描述 |
|---|---|---|
| compact | compact | 不建议使用。请使用样式取代它。 规定列表呈现的效果比正常情况更小巧。 |
| type |
| 不建议使用。请使用样式取代它。 规定列表的项目符号的类型。 |
全局属性
<ul> 标签支持 HTML 中的 全局属性。
事件属性
<ul> 标签支持 HTML 中的 事件属性。
更多实例
<!DOCTYPE html><html><body><h1>所有ul的list样式</h1><ul style="list-style-type:circle"><li>咖啡</li><li>茶</li><li>牛奶</li></ul><ul style="list-style-type:disc"><li>咖啡</li><li>茶</li><li>牛奶</li></ul><ul style="list-style-type:square"><li>咖啡</li><li>茶</li><li>牛奶</li></ul></body></html>
<!DOCTYPE html><html><body><h1>用CSS修改列表的行高</h1><p>增加列表的行高:</p><ul style="line-height:180%"><li>咖啡</li><li>茶</li><li>牛奶</li></ul><p>减少列表的行高:</p><ul style="line-height:80%"><li>咖啡</li><li>茶</li><li>牛奶</li></ul></body></html>
ul 标签的默认样式
ul {display: block;list-style-type: disc;margin-top: 1em;margin-bottom: 1 em;margin-left: 0;margin-right: 0;padding-left: 40px;}