html展示列表,如何在HTML中展示列表？

如何在HTML中展示列表？

在HTML中，我们可以创建三种类型的列表：

无序列表

有序列表

描述列表

无序列表

无序列表是顺序或顺序无关紧要的项的集合或集合。如果我们要在

HTML文档中创建无序列表以显示网页上的项目，则遵循下面给出的步骤。使用这些步骤，我们可以轻松创建

无序列表。

第1步：新建一个HTML文件，输入简单的html代码。

创建无序列表

下面列表是一个无序列表:

第2步：在

第3步：我们使用

• 标签来显示列表，键入开头的
• 标签然后，在键入每个项目之后，我们还需要关闭
• 标签。
  • 第一个无序项
  • 第二个无序项

  第4步：：创建所有列表项后，通过结束标签来关闭列表。

  • 第一个无序项1
  • 第一个无序项2
  • 第一个无序项3
  • 第一个无序项4
  • 第一个无序项5
  • 第一个无序项6

  第5步：保存HTML文件在浏览器中运行该文件。

  Create Unordered list

  The list which is shown below is an unordered list:

  • First Unordered item
  • Second Unordered item
  • Third Unordered item
  • Fourth Unordered item
  • Fifth Unordered item
  • Sixth Unordered item

  上述Html代码的输出显示在以下屏幕快照中：

  

  有序列表

  如果我们要在HTML文件中创建

  有序列表，那么按照下面步骤我们可以轻松地创建一个有序列表。

  第1步：我们在文本编辑器中键入Html代码，我们要在其中创建有序列表的文本编辑器。

  Create ordered list

  The list which is shown below is an ordered list:

  第2步：在

  中输入

1. 标签，该标签用于按顺序显示项目。

第3步：使用

标签显示列表，键入每个列表项开始标签，在每个项后关闭标签。

1. apple
2. Mango

第4步：键入所有列表项，通过结束标签来关闭列表。

1. apple
2. Mango
3. Pineapple
4. Orange
5. Banana

第5步：最后，我们保存HTML文件，然后在浏览器中运行该文件。

Create ordered list

The list which is shown below is an ordered list:

1. apple
2. Mango
3. Pineapple
4. Orange
5. Banana

上述HTML代码的输出显示在以下屏幕截图中：

描述列表

描述列表是具有其描述和定义的项目列表。

如果我们要在HTML文档中创建"描述"列表，以在网页上显示这些项目及其描述那么我们遵循以下步骤。使用这些步骤，我们可以轻松地创建描述列表。

第1步：在文本编辑器中键入Html代码。

创建一个描述列表

下面演示如何创建描述列表：

第2步：在

中输入

第3步：使用

标签，写完所有列表项之后，我们关闭标签。

下面演示如何创建描述列表：

HTML

第4步：使用

标签定义每个列表的描述。

The list which is shown below is an description list:

HTML

超文本标签语言

CSS

Cascading Stle sheet

UL

Unordered List

第5步：关闭

标签。

The list which is shown below is an description list:

HTML

Hyper Text Markup Language

CSS

Cascading Stle sheet

UL

Unordered List

第6步：保存HTML文件在浏览器中运行该文件。

Create Description list

The list which is shown below is an description list:

HTML

Hyper Text Markup Language

CSS

Cascading Stle sheet

UL

Unordered List

OL

Ordered List

上述HTML代码的输出显示在以下屏幕截图中：