无序列表
❮ 上一节 下一节 ❯
HTML 无序列表HTML <ul> 标签界说无序（项指标记）列表。
无序列表无序列表以 <ul> 标签初步。每个列表项都以 <li> 标签初步。
无序列表是一个项宗旨列表，默许状况下，此列名目运用粗体圆点（典型的小黑圆圈）停行符号:
真例
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
亲身试一试 »
无序列表 - 选择列表项符号CSS list-style-type 属性用于界说列表项符号的花式。它可以具有以下值之一:
值 形容disc 将列表项符号设置为项指标记（默许）
circle 将列表项符号设置为圆形
square 将列表项符号设置为正方形
none 列表项将不被符号
真例 - 项指标记
<ul style="list-style-type:disc;">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
真例 - 圆形
<ul style="list-style-type:circle;">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
真例 - 正方形
<ul style="list-style-type:square;">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
真例 - None
<ul style="list-style-type:none;">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
列表可以嵌淘（列表中的列表）:
真例
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
注释: 一个列表项 (<li>) 可以包孕一个新的列表和其余 HTML 元素，比如图像和链接等。
CSS 水平列表HTML 列表可以用多种差异的 CSS 方式设置花式。
一种风止的办法是水平设置列表花式，以创立导航菜单:
真例
<!DOCTYPE html>
<html>
<head>
<style>
ul {
list-style-type: none;
margin: 0;
padding: 0;
oZZZerflow: hidden;
background-color: #333333;
}
li {
float: left;
}
li a {
display: block;
color: white;
teVt-align: center;
padding: 16pV;
teVt-decoration: none;
}
li a:hoZZZer {
background-color: #111111;
}
</style>
</head>
<body>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#about">About</a></li>
</ul>
</body>
</html>
提示: 理解更多有关CSS的信息: CSS 教程。
原章小结运用 HTML <ul> 元素界说无序列表
运用 CSS list-style-type 属性界说列表项符号
运用 HTML <li> 元素界说列表项
列表可以嵌淘
列表项可以包孕其余 HTML 元素
运用 CSS 属性 float:left 从右到左水平显示列表
HTML List 标签 标签 形容<ul> 界说无序列表。
<ol> 界说有序列表。
<li> 界说列表项。
<dl> 界说界说列表。
<dt> 界说界说名目。
<dd> 界说界说的形容。
如需所有可用的 HTML 标签的完好列表，请会见 HTML 标签参考手册。
❮ 上一节 下一节 ❯