html的列表
1.无序列表(最常用)
先看个例子:如下图:

使用的 html标签为
<ul> <!--ul是UnorderList的缩写,意为无序列表;li是ListItem的缩写,列表项-->
<li></li>
</ul>
<html>
<head>
<title>html list test</title>
</head>
<body>
<!--ul is the Unordered_List -->
<ul>
<!--li is List_Item-->
<li>Tommy</li>
<li>Jacky</li>
<li>Sam</li>
</ul>
</body>
</html>
注意:在上述的图中,看样看到列表前面有个小圆圈,这是通过修改 ul标签的 type属性来变化的
<ul type="value"> 属性值:
| 值 | 描述 |
|---|---|
| disc | 默认值。实心圆。 |
| circle | 空心圆。 |
| square | 实心方块。 |
更多信息请参考官方文档:http://www.w3school.com.cn/tags/att_ul_type.asp
2.有序列表(用的不多)
标签为: <ol> <!--ol是OrderedList的简称-->
<li></li>
</ol>
ol的排序指的是在数据的前方显示序号而已,并不会对内容进行任何排序(所以是个鸡肋)
两个常用的属性:
2.1. type属性:5个候选值,表示排序所使用的文字
2.2. start属性:表示排序的起始位置,效果如下图

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8;"/>
<title>html ordered list test</title>
</head>
<body>
<ol type="1">
<li><font color="red">当type为数字1时,表示前方的排序用阿拉伯数字</font></li>
<li>Tommy</li>
<li>Jacky</li>
<li>Sam</li>
</ol>
<ol type="a">
<li><font color="red">当type为a时,表示前方的排序用小写字母</font></li>
<li>Tommy</li>
<li>Jacky</li>
<li>Sam</li>
</ol>
<ol type="A">
<li><font color="red">当type为A时,表示前方的排序用大写字母</font></li>
<li>Tommy</li>
<li>Jacky</li>
<li>Sam</li>
</ol>
<ol type="i">
<li><font color="red">当type为小写字母i时,表示前方的排序用小写罗马数字</font></li>
<li>Tommy</li>
<li>Jacky</li>
<li>Sam</li>
</ol>
<ol type="I">
<li><font color="red">当type为大写字母I时,表示前方的排序用大写罗马数字</font></li>
<li>Tommy</li>
<li>Jacky</li>
<li>Sam</li>
</ol>
<ol start="100">
<li><font color="red">start为排序起始数字,这里从100开始</font></li>
<li>Tommy</li>
<li>Jacky</li>
<li>Sam</li>
</ol>
</body>
</html>
html的列表的更多相关文章
- ASP.NET Aries 入门开发教程8:树型列表及自定义右键菜单
前言: 前面几篇重点都在讲普通列表的相关操作. 本篇主要讲树型列表的操作. 框架在设计时,已经把树型列表和普通列表全面统一了操作,用法几乎是一致的. 下面介绍一些差距化的内容: 1:树型列表绑定: v ...
- ASP.NET Aries 入门开发教程6:列表数据表格的格式化处理及行内编辑
前言: 为了赶进度,周末也写文了! 前几篇讲完查询框和工具栏,这节讲表格数据相关的操作. 先看一下列表: 接下来我们有很多事情可以做. 1:格式化 - 键值的翻译 对于“启用”列,已经配置了格式化 # ...
- ASP.NET Aries 入门开发教程3:开发一个列表页面及操控查询区
前言: Aries框架毕竟是开发框架,所以重点还是要写代码的,这样开发人员才不会失业,哈. 步骤1:新建html 建一个Html,主要有三步: 1:引入Aries.Loader.js 2:弄一个tab ...
- ASP.NET Aries 入门开发教程2:配置出一个简单的列表页面
前言: 朋友们都期待我稳定地工作,但创业公司若要躺下,也非意念可控. 若人生注定了风雨飘摇,那就雨中前行了. 最机开始看聊新的工作机会,欢迎推荐,创业公司也可! 同时,趁着自由时间,抓紧把这系列教程给 ...
- 散列表(hash table)——算法导论(13)
1. 引言 许多应用都需要动态集合结构,它至少需要支持Insert,search和delete字典操作.散列表(hash table)是实现字典操作的一种有效的数据结构. 2. 直接寻址表 在介绍散列 ...
- Python列表去重
标题有语病,其实是这样的: 假设有两个列表 : L1 = [1,2,3,4] ; L2 = [1,2,5,6] 然后去掉L1中包含的L2的元素 直接这样当然是不行的: def removeExists ...
- WPF 微信 MVVM 【续】修复部分用户无法获取列表
看过我WPF 微信 MVVM这篇文章的朋友,应该知道我里面提到了我有一个小号是无法获取列表的,始终也没找到原因. 前两天经过GitHub上h4dex大神的指导,知道了原因,是因为微信在登录以后,web ...
- Emoji选项列表
一.需要的前提文件 从网上下载Emoji的表情包,当然是png的图片,因为WPF不支持彩色的Emoji,所以,做列表的时候,需要用图片. 随着压缩包一起的还有一个Emoji.xml文件,文件的层级结构 ...
- UWP开发必备:常用数据列表控件汇总比较
今天是想通过实例将UWP开发常用的数据列表做汇总比较,作为以后项目开发参考.UWP开发必备知识点总结请参照[UWP开发必备以及常用知识点总结]. 本次主要讨论以下控件: GridView:用于显示数据 ...
- 在DevExpress程序中使用GridView直接录入数据的时候,增加列表选择的功能
在我上篇随笔<在DevExpress程序中使用Winform分页控件直接录入数据并保存>中介绍了在GridView以及在其封装的分页控件上做数据的直接录入的处理,介绍情况下数据的保存和校验 ...
随机推荐
- memcached整理の内存管理及删除机制
内存的碎片化 如果用C语言直接malloc,free来向操作系统申请和释放内存时,在不断申请和释放的过程中,形成了一些很小的内存片段,无法再利用.这种空闲但无法利用内存的现象称为内存的碎片化. sla ...
- [LeetCode 题解]: String to Interger (atoi)
Implement atoi to convert a string to an integer. Hint: Carefully consider all possible input cases. ...
- IO模型《三》非阻塞IO
非阻塞IO(non-blocking IO) Linux下,可以通过设置socket使其变为non-blocking.当对一个non-blocking socket执行读操作时,流程是这个样子: 从图 ...
- day04.4-装饰器
1. 装饰器 装饰器本身就是函数,功能是为其他函数添加附加功能 装饰器的设计原则: (a). 不修改被修饰函数的源代码: (b). 不修改被修改函数的调用方法. 装饰器=高阶函数+函数嵌套+闭包 装饰 ...
- day02.5-集合内置方法
集合——set的定义:test = {1,2,3,4,5} 或 test = frozenset(1,2,3,4,5) 特点:1. 集合是可变数据类型 2. 集合中元素是无序的,可以是数字.字符串与元 ...
- Jupyter Notebook远程服务器配置[转]
首先要生成密码,打开python终端. In [1]: from IPython.lib import passwd In [2]: passwd() Enter password: Verify p ...
- Linux 与 Windows 搭建域名解析
实现 Win2012-D1 中 DNS 服务器的冗余备份,同时提供本域内主机名与 IP 地址的解析,此域名服务器的地址数据库需要 Win2012-D1 中定期更新. 假设环境:Server12 以及 ...
- Struts2与easyui分页查询
easyui里面分页查询:在easyui框架里面已经进行一些分装,所以我们只要进行后台分页查询即可 web.xml和struts.xml文件的配置的就不需要我多说了,和分页前代码一样,不需要更改: 需 ...
- uC/OS-II 函数之内存管理相关函数
上文主要介绍了邮箱管理相关的函数,本文介绍内存管理相关的函数:OSMemCreate()内存块创建函数,OSMemGet()函数,OSMemPut()函数,OSMemQuery()函数.以前用过的uC ...
- nginx高性能WEB服务器系列之五--实战项目线上nginx多站点配置
nginx系列友情链接:nginx高性能WEB服务器系列之一简介及安装https://www.cnblogs.com/maxtgood/p/9597596.htmlnginx高性能WEB服务器系列之二 ...