列表

1.有序列表

介绍:

HTML有序列表（Ordered List） 是用于展示有逻辑顺序、优先级或步骤性内容的标签组合，核心作用是让内容按可识别的序号排列，提升可读性。 有序列表<ol></ol>

案例：

<ol type="a">
  <li>管理学院</li>
  <li>设计学院</li>
  <li>龙都学院</li>
  <li>学前教育学院</li>
  <li>艺术学院</li>
</ol>

有序列表的属性：

type属性值	对应的序号类型	示例
type="1"	数字标号	1, 2, 3
type="a"	小写字母标号	a, b, c
type="A"	大写字母标号	A, B, C
type="i"	小写罗马数字标号	i, ii, iii, iv
type="I"	大写罗马数字标号	I, II, III, IV

有序列表的嵌套：

案例

<ol>
    <li>江汉艺术职业学院</li>
    <ol>
       <li>设计学院</li>
       <li>艺术学院</li> 
    </ol>
    <li>荆州职业学院</li>
<ol>
    <li>软件学院</li>
    <li>无人机学院</li>
    <li>智能制造学院</li>
</ol>
<li>天门职业学院</li>
<li>武汉职业技术学院</li>

效果：

1.江汉艺术职业学院

• 1.设计学院
• 2.艺术学院

2.荆州理工职业学院

• 1.软件学院
• 2.无人机学院
• 3.智能制造学院

3.天门职业学院

4.武汉职业技术学院

2.无序列表

介绍

HTML无序列表（Unordered List） 是用于展示无固定顺序、并列关系内容的标签组合，核心作用是让内容以项目符号的形式呈现，增强内容的区分度。

案例：

<ul>
    <li>江汉艺术职业学院</li>
    <ul>
       <li>管理学院</li>
       <li>设计学院</li>
       <li>音乐学院</li>
    </ul>
    <li>荆州理工职业学院</li>
    <ul>
        <li>软件学院</li>
        <li>无人机学院</li>
    </ul>
</ul>

效果：

• 江汉艺术职业学院

  ◦管理学院

  ◦设计学院

  ◦音乐学院

• 荆州理工职业学院

  ◦软件学院

  ◦无人机学院

3.自定义列表

介绍

HTML 自定义列表（ <dl> ）用于展示术语-解释或标题-内容的关联关系，核心由 3 个标签配合使用。

案例：

<dl>
    <dt>电器</dt>
    <dd>洗衣机</dd>
    <dd>电视机</dd>
    
    <dt>书籍</dt>
    <dd>言情小说</dd>
    <dd>武侠小说</dd>
    <dd>科幻小说</dd>
</dl>

效果：

电器

洗衣机

电视机

书籍

言情小说

武侠小说

科幻小说

注意：

1. <dl></dl> <dt></dt> <dd></dd>三个标签之间不允许出现其他标签
2. <dl></dl>标签必须与标签相邻

属性

type 属性值	对应的列表标记样式
disc	默认实心圆
circle	空心圆
square	实心小方块
none	去掉标记符号