无忧公告:  建站无忧一号群开放:群号:46305815 一起讨论建站时所遇到的问题。   
内容搜索: 标题内容作者
背景: #EDF0F5 #FAFBE6 #FFF2E2 #FDE6E0 #F3FFE1 #DAFAF3 #EAEAEF 默认  
阅读新闻

HTML入门之九(HTML列表)

[日期:2007-12-31] 来源:http://www.jzwy.net  作者:本站站长 [字体: ]
HTML支持有序、无序和自定义列表。



示例

一个无序列表:



这个例子显示了一个无序列表。


有序列表:



这个例子显示了一个有序列表。


在这个页面的底部,还有更多例子。



无序列表

无序列表是一个项目的序列。各项目前加有标记(通常是黑色的实心小圆圈)。

无序列表以<ul>标签开始。每个列表项目以<li>开始。

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

在浏览器中显示如下:

  • Coffee
  • Milk

无序列表的项目中可以加入段落、换行、图像,链接,其他的列表等等。



有序列表

有序列表也是一个项目的序列。各项目前加有数字作标记。

有序列表以<ol>标签开始。每个列表项目以<li>开始。

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

在浏览器中显示如下:

  1. Coffee
  2. Milk

有序列表的项目中可以加入段落、换行、图像,链接,其他的列表等等。



自定义列表

自定义列表不是一个项目的序列,它是一系列条目和它们的解释。

有序列表以<dl>标签开始,自定义列表条目以<dt>开始,自定义列表的定义以<dd>开始。

<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>

在浏览器中显示如下:

Coffee
Black hot drink
Milk
White cold drink

自定义列表的定义(标签<dd>)中可以加入段落、换行、图像,链接,其他的列表等等。



更多示例:

有序列表的不同类型:


这个例子显示了有序列表的不同类型。


无序列表的不同类型:


这个例子显示了无序列表的不同类型。


嵌套列表:


这个例子说明了可以怎样嵌套列表。


嵌套列表2:


这个例子说明了如何创建一个更复杂化的嵌套列表。


自定义列表:


这个例子说明了如何创建一个自定义列表。
阅读:
录入:无忧

推荐 】 【 打印
本文评论       全部评论
发表评论


点评: 字数
姓名:

  • 尊重网上道德,遵守中华人民共和国的各项有关法律法规
  • 承担一切因您的行为而直接或间接导致的民事或刑事法律责任
  • 本站管理人员有权保留或删除其管辖留言中的任意内容
  • 本站有权在网站内转载或引用您的评论
  • 参与本评论即表明您已经阅读并接受上述条款