首页 > web前端 > html教程 > html中的有序列表和无序列表

html中的有序列表和无序列表

墨辰丷
发布: 2018-05-11 11:38:25
原创
4175 人浏览过

本篇文章主要介绍html中的有序与无序列表示如何编写的,对于刚开始学习的小伙伴还是非常有帮助的,感兴趣的朋友参考下。

有序列表代码如下:

<html>  
<h2>数字显示</h2>  
<ol>  
<li>第一天</li>  
<li>第二天</li>  
<li>第三天</li>  
<li>第四天</li>  
</ol>  
  
<h2>字母显示</h2>  
<ol type="a">  
<li>第一天</li>  
<li>第二天</li>  
<li>第三天</li>  
<li>第四天</li>  
</ol>  
  
<h2>小写罗马数字显示</h2>  
<ol type="i">  
<li>第一天</li>  
<li>第二天</li>  
<li>第三天</li>  
<li>第四天</li>  
</ol>  
  
<h2>大写罗马数字显示</h2>  
<ol type="I">  
<li>第一天</li>  
<li>第二天</li>  
<li>第三天</li>  
<li>第四天</li>  
</ol>  
  
<h2>数字显示,自己确定开始数字</h2>  
<ol start="5">  
<li>第一天</li>  
<li>第二天</li>  
<li>第三天</li>  
<li>第四天</li>  
</ol>  
<html>
登录后复制

效果如下:

55.png

无序列表代码如下:

<html>  
********默认为实心圆*********  
<ul>  
<li>第一天</li>  
<li>第二天</li>  
<li>第三天</li>  
<li>第四天</li>  
</ul>  
  
********空心圆显示*********  
<ul type="circle">  
<li>第一天</li>  
<li>第二天</li>  
<li>第三天</li>  
<li>第四天</li>  
</ul>  
  
********实心矩形显示*********  
<ul type="square">  
<li>第一天</li>  
<li>第二天</li>  
<li>第三天</li>  
<li>第四天</li>  
</ul>  
</html>
登录后复制

效果如下:

56.png

相关推荐:

什么是无序列表、有序列表 、定义列表?html列表标签学习笔记

关于HTML列表的详细介绍

HTML列表标签dl、ul、ol 的使用

以上是html中的有序列表和无序列表的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板