码迷,mamicode.com
首页 > Web开发 > 详细

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

时间:2014-09-09 20:11:59      阅读:291      评论:0      收藏:0      [点我收藏+]

标签:style   http   color   io   使用   ar   strong   art   div   

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

有序列表:
<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>


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

标签:style   http   color   io   使用   ar   strong   art   div   

原文地址:http://blog.csdn.net/chun_1959/article/details/39159415

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!