HTML为无涯教程提供了三种指定信息列表的方式。列表可能包含-
<ul> - 无序列表。
<ol> - 有序列表。
<dl> - 定义列表。
无序列表是没有特殊顺序或序列的相关项目的集合,该列表是使用HTML <ul>标签创建的, 列表中的每个项目都标有项目符号。
<!DOCTYPE html> <html> <head> <title>HTML Unordered List</title> </head> <body> <ul> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ul> </body> </html>
这将产生以下输出-
您可以使用<ul>标签的type属性来指定所需的项目符号类型,默认情况下,它是disc。 以下是可能的选项-
<ul type="square"> <ul type="disc"> <ul type="circle">
以下是无涯教程使用<ul type =“ square”>的示例
<!DOCTYPE html> <html> <head> <title>HTML Unordered List</title> </head> <body> <ul type="square"> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ul> </body> </html>
这将产生以下输出-
以下是使用<ul type =“ disc”>的示例-
<!DOCTYPE html> <html> <head> <title>HTML Unordered List</title> </head> <body> <ul type="disc"> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ul> </body> </html>
这将产生以下输出-
以下是使用<ul type =“ circle”>的示例-
<!DOCTYPE html> <html> <head> <title>HTML Unordered List</title> </head> <body> <ul type="circle"> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ul> </body> </html>
这将产生以下输出-
如果需要将项目放在编号列表中而不是项目符号,则将使用HTML排序列表。 该列表是通过使用ol标签创建的。 编号从1开始,并且对于每个用li标签的连续有序列表元素,其编号递增1。
<!DOCTYPE html> <html> <head> <title>HTML Ordered List</title> </head> <body> <ol> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ol> </body> </html>
这将产生以下输出-
您可以对ol标签使用type属性,以指定所需的编号类型, 默认情况下,它是一个number。 以下是可能的选项-
<ol type="1"> - Default-Case Numerals. <ol type="I"> - Upper-Case Numerals. <ol type="i"> - Lower-Case Numerals. <ol type="A"> - Upper-Case Letters. <ol type="a"> - Lower-Case Letters.
以下是使用<ol type =“ 1”>
<!DOCTYPE html> <html> <head> <title>HTML Ordered List</title> </head> <body> <ol type="1"> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ol> </body> </html>
这将产生以下输出-
以下是使用<ol type =“ I”>
<!DOCTYPE html> <html> <head> <title>HTML Ordered List</title> </head> <body> <ol type="I"> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ol> </body> </html>
这将产生以下输出-
以下是使用<ol type =“ i”>
<!DOCTYPE html> <html> <head> <title>HTML Ordered List</title> </head> <body> <ol type="i"> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ol> </body> </html>
这将产生以下输出-
以下是使用<ol type =“ A”>的示例
<!DOCTYPE html> <html> <head> <title>HTML Ordered List</title> </head> <body> <ol type="A"> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ol> </body> </html>
这将产生以下输出-
以下是使用<ol type =“ a”>
<!DOCTYPE html> <html> <head> <title>HTML Ordered List</title> </head> <body> <ol type="a"> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ol> </body> </html>
这将产生以下输出-
您可以使用<ol>标签的开始属性来指定所需编号的起点,以下是可能的选项-
<ol type="1" start="4"> - Numerals starts with 4. <ol type="I" start="4"> - Numerals starts with IV. <ol type="i" start="4"> - Numerals starts with iv. <ol type="a" start="4"> - Letters starts with d. <ol type="A" start="4"> - Letters starts with D.
以下是使用<ol type =“ i” start =“ 4”>的示例
<!DOCTYPE html> <html> <head> <title>HTML Ordered List</title> </head> <body> <ol type="i" start="4"> <li>Beetroot</li> <li>Ginger</li> <li>Potato</li> <li>Radish</li> </ol> </body> </html>
这将产生以下输出-
定义列表使用以下三个标签。
<!DOCTYPE html> <html> <head> <title>HTML Definition List</title> </head> <body> <dl> <dt><b>HTML</b></dt> <dd>This stands for Hyper Text Markup Language</dd> <dt><b>HTTP</b></dt> <dd>This stands for Hyper Text Transfer Protocol</dd> </dl> </body> </html>
这将产生以下输出-
祝学习愉快!(内容编辑有误?请选中要编辑内容 -> 右键 -> 修改 -> 提交!)