html列表的种类（HTML—列表）

一.列表

     列表是网页中最常用的一种数据排列方式                。在HTML中
  
  
  
  
  
  
  
 ，列表共有三种：有序列表
  
  
  
  
  
  
  
 、无序列表和定义列表
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
。

二.有序列表

    1.一般采用数字或字母作为顺序  
  
  
  
  
  
  
  ，默认采用数字顺序














。

   语法：

<ol> <li>列表项</li> <li>列表项</li> <li>列表项</li> </ol>

***在该语法中
 


 


 


 


 


 


 


 

，<ol>和</ol>标志着有序列的开始和结束,而<li>和</li>标签表示这是一个列表项 
  
  
  
  
  
  
  
 。一个有序列表可以包含多个列表项
  
  
  
  
  
  
  
 。

     ol标签和li标签需要配合一起使用
 
 
 
 
 
 
 
，不可以单独使用   
   
   
   
   
   
   
   ，而且<ol>标签的子标签也只能是li标签
 

 

 

 

 

 

 

 
，不能是其他标签
 


 


 


 


 


 


 


 
。

    2.type属性（在HTML中

 

 

 

 

 

 

 

，我们可以使用type属性来改变列表项符号）

语法

<ol type="属性值"> <li>列表项</li> <li>列表项</li> <li>列表项</li> </ol>

type属性取值

属性值 列表项符号 1 阿拉伯数字：1  
  
  
  
  
  
  
  、2
 


 


 


 


 


 


 


 

、3······（默认值） a 小写英文字母：a
 
 
 
 
 
 
 
、b   
   
   
   
   
   
   
   、c······ A 大写英文字母：A
 

 

 

 

 

 

 

 
、B

 

 

 

 

 

 

 

、C····· i 小写罗马数字：i                、ii
 
 

 
 

 
 

 
 

 
 

 
 

 
 

 
 、iii······ l 大写罗马数字：l















、ll                       、lll······

eg:

 三.无序列表

1.语法：

<ul> <li>列表项</li> <li>列表项</li> <li>列表项</li> </ul>

***<ul>和</ul>标志着一个无序列表的开始和结束                ，<li>表示这是一个列表项 
 
 
 
 
 
 
 
。一个无须列表可以         包含多个列表项
   
   
   
   
   
   
   
  。 

     注意
 
 

 
 

 
 

 
 

 
 

 
 

 
 

 
 ，ul标签和li标签也需要一起使用















，不可以单独使用                       ，而且ul标签的子标签也只能是li标签 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 ，不能是其他标签
 

 

 

 

 

 

 

 
。这一点与有序列表是一样的 

 

 

 

 

 

 

 
。

2.type属性

语法：

<ul type="属性值"> <li>列表项</li> <li>列表项</li> <li>列表项</li> </ul>

type属性值

属性值 列表项符号 disc 实心圆●（默认值） circle 空心圆○ square 正方形■

eg:

 3.深入无序列表

    对于无序列表来说























，还需注意以下两点：

    1.ul元素的子元素只能是li               ，不能是其他元素                。

    2.ul元素内部的文本  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 ，只能在li元素内部添加















，不能在li元素外部添加

 
 

 
 

 
 

 
 

 
 

 
 

 
 

 
。

eg:ul元素的子元素只能是li
  
  
  
  
  
  
  
 ，不能是其他元素

***分析：上面的代码是错误的  
  
  
  
  
  
  
  ，正确做法如下 

<div>前端最核心3个技术：</div> <ul> <li>HTML</li> <li>CSS</li> <li>JavaScript</li> <ul>

四.定义列表

    在HTML中
 


 


 


 


 


 


 


 

，定义列表由两部分组成：名词和描述














。

   语法：

<dl> <dt>名词</dt> <dd>描述</dd> ...... </dl>

  在改语法中
 
 
 
 
 
 
 
，<dl>标记和</dl>标记分别定义了定义列表的开始和结束   
   
   
   
   
   
   
   ，dt标签用于添加要解释的名词
 

 

 

 

 

 

 

 
，而dd标签用于添加该名词的具体解释                        。

eg:

五.HTML语义化

eg:  使用div实现的列表

 ***分析：HTML的精髓就在于标签的语义
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
。在HTML中

 

 

 

 

 

 

 

，大部分标签都有它自身的语义






















。例如                ，p标签
 
 

 
 

 
 

 
 

 
 

 
 

 
 

 
 ，表示paragraph















，标记的是一个段落；h1标签                       ，表示的是header1 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 ，标记的是一个最高级标题                。但div和span是无语义的标签























，我们应优先使用其他有语义的标签
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
。语义是非常重要的一个思想               ，对于搜索引擎优化来说也很重要














。