HTML学习之有序列表、无序列表和自定义列表

浏览数：45 / 时间：2015年06月09日

列表分成三种类型：有序列表、无序列表和自定义列表。

有序列表使用编号来记录项目的顺序

无序列表使用项目符号来记录无序的项目

自定义列表它由两个部分组成：定义条件和定义描述。

有序列表：

....

</OL>

type

1 阿拉伯数字

a英文小写

A英文大写

i罗马小写数字

I罗马大写数字

start编号样式的

起始数字，如：编号样式设为A，起始值设置为2，则列表的起始值为B

测试程序如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head>
    <body >
   <marquee direction="right" behavior="alternate" bgcolor="#3333FF">
   hello,great boy.......  
   </marquee>   
   <hr>
   
  <ol type="1" start="5">
       <li>时间</li>
       <li>金钱</li>
       <li>权利</li>
       <li>自由</li>
  </ol>
   
 
</html>

HTML无序列表：

§无序列表标记

<UL>

....

</UL>

type

circle 空心圆

disc圆点

square正方形

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head>
    <body >
   <marquee direction="right" behavior="alternate" bgcolor="#3333FF">
   hello,great boy.......  
   </marquee>   
   <hr>
   
  <ul type="disc"  >
   <li>项目一</li>
   <li>项目二</li>
   <li>项目三</li>
  </ul>
   
 
</html>

自定义列表：

<html>
<head>
	<title>标题</title>
</head>

<body>
    <DL>
      <DT>☆<DD>无序列表</DD>
      <DT>☆<DD>有序列表</DD>
      <DT>☆<DD>定义列表</DD>
    </DL>
    <DL>
     	<DT>无序列表</DT><DD>不以数字为开始，而是使用一个符号作为分项标记的列表。</DD>
     	<DT>有序列表</DT><DD>使用数字编号，分项带有顺序性质的列表。</DD>
     	<DT>定义列表</DT><DD>用于解释名词的列表，包含了两种层次，一是名词，一是名词的解释。</DD>
    </DL>

             
 
</body>
</html>

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

HTML学习之有序列表、无序列表和自定义列表