您的位置：首页 > Web前端 > HTML

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

2014-09-09 19:09 585 查看
列表分成三种类型：有序列表、无序列表和自定义列表。
有序列表使用编号来记录项目的顺序
无序列表使用项目符号来记录无序的项目
自定义列表它由两个部分组成：定义条件和定义描述。

有序列表：

<OL  type="编号样式" start="编号起始值">
  <LI>项目一</LI>

  <LI>项目二</LI>

  ....

  </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>

  <LI>项目一</LI>

  <LI>项目二</LI>

  ....

</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>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航