devbox
知新_RL
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

HTML：有序列表、无序列表、自定义列表的 区别&写法_有序列表和无序列表的区别

作者：知新_RL | 2024-03-28 08:30:15

赞

踩

有序列表和无序列表的区别

目录

一、三种列表的简介

1、有序列表——ol

2、无序列表——ul

3、自定义列表——dl

二、三种列表的写法

1、有序列表 ：是ol标签里面包着li标签

2、无序列表 ：是ul标签里面包着li标签

3、自定义列表：以dl标签开始，每个自定义列表项以dt标签开头，每个自定义列表项的定义以dd标签开始。

一、三种列表的简介

1、有序列表——ol

有自带的排序(1,2,3,…)。

2、无序列表——ul

没有有序列表那样的排序数字，但是每个列表的前面有个圆点，这是无序列表的特点。

3、自定义列表——dl

什么样式都没有，就是普通的列表。

二、三种列表的写法

1、有序列表 ：是ol标签里面包着li标签

  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>无标题文档</title>
  6. </head>
  7.  
  8. <body>
  9. 	<ol>
  10. 		<li>第一列</li>
  11. 		<li>第二列</li>
  12. 		<li>第三列</li>
  13. 		<li>第四列</li>
  14. 		<li>第五列</li>
  15. 	</ol>
  16. </body>
  17. </html>

结果：

2、无序列表 ：是ul标签里面包着li标签

  1. <ul>
  2.     <li>第一列</li>
  3.     <li>第二列</li>
  4.     <li>第三列</li>
  5.     <li>第四列</li>
  6.     <li>第五列</li>
  7. </ul>

结果：

3、自定义列表：以dl标签开始，每个自定义列表项以dt标签开头，每个自定义列表项的定义以dd标签开始。

  1. <dl>
  2.         <dt>第一列</dt>
  3.         <dd>jioeidwjidojwdiowqd</dd>
  4.         <dt>第二列</dt>
  5.         <dd>ncmlkerkf,eprlc;kep</dd>
  6.         <dt>第二列</dt>
  7.         <dd>ncmlkerkf,eprlc;kep</dd>
  8. </dl>

结果：

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/知新_RL/article/detail/328900
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号