列表的基本语法

ol：有序列表

ul：无序列表

li：列表项

dl：列表

dt：列表项

dd：列表描述

常用列表

1.无序列表：使用标签 ul，li 属性：disc（默认实心圆） circle （空心圆）square （方块）

2.有序列表：使用标签ol，li 属性：A（大写字母） a （小写字母）l （大写罗马数字）i （小写罗马数字）start （设置开始阿拉伯数字）

3.混合列表 : 使用标签 ul ol li

4.自定义列表 ： 使用标签 dl dt dd

！！！！！！代码实例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>H5表格</title>
</head>
<body>
   <ul type="square">
       <li>香蕉</li>
       <li>香蕉</li>
       <li>香蕉</li>
   </ul>
   <ol type="I">
       <li>香蕉</li>
       <li>香蕉</li>
       <li>香蕉</li>
   </ol>
   <ul type="square">
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
   </ul>
    <dl>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
    </dl>
</body>
</html>

效果图

H5学习之旅-H5列表（8）的更多相关文章

  1. H5学习之旅-H5的表单（11）

    H5的表单元素 form:表单 input:输入域,type属性可以设置text,password,button等不同的属性 textarea:文本域 lable:控制标签 fieldset:定义域 ...

  2. H5学习之旅-H5的基本标签（2）

    H5的标签和html的标签没什么区别,主要介绍H5的基本标签 1.基础标签header和body,header的<title>元素主要是显示在标签页面里面,以及设置使用的语言和编码格式.b ...

  3. H5学习之旅-H5的新特性（1）

    随着H5的发展,网页开发呈现了跨平台的特性,目前H5是兼容各大平台的,这也为一些其他的技术的跨平台开发提供了基础,所以我预测后H5会成为很重要的开发语言 新特性介绍 1.用于回话的canvas标签 2 ...

  4. H5 学习之旅-H5表格（7）

    表格语法 table:简历表格 captian:表格标题 th:表格行表头 tr:表格行 td:单元格 thead:表格页眉 tfoot:表格页脚 tbody:表格主体 col:列属性 !!!代码实例 ...

  5. H5学习之旅-H5的超链接以及图片链接（6）

    链接内容 1.文本链接 2.图片链接 属性 href:指向另一个文档的链接 name:文档内部的链接 img标签属性 alt:替换文本属性 width:宽 height:高 代码实例 <!DOC ...

  6. H5学习之旅-H5的样式（5）

    样式的引入方式 外部样式表 link rel = "stylesheet" type = "text/css" href = "mystyle.css ...

  7. H5学习之旅-H5的格式化（4）

    H5的格式设置: b代表是粗体 i斜体 big 字体变大 small变小 em强调 strong 加强和变粗差不多 sub 定义下标字 sup 定义上标字 ins 插入字 del 删除字 代码实例 & ...

  8. H5学习之旅-H5的框架（13）

    H5框架语法介绍 :frame:框架对于页面的设计有很大的作用 frameSet:框架集标签定义如何将窗口分割为框架 ,每一个frameset定义一些列行或者列,rowS/COLS规定了每行或者每列占 ...

  9. H5学习之旅-H5与Php交互（12）

    1.首先介绍PHP开发环境的搭建 ,在Google搜apachefriends,会有xampp的下载链接,这个工具集成了apache的很多服务 2.搭建php的编辑环境,选取eclipse安装php插 ...

随机推荐

  1. 检测linux vps是xen openvz还是kvm的方法

    很多时候不知道自己买的vps是那种虚拟化技术,怕给商家忽悠了,下面给大家介绍下怎么简单的判断自己vps的虚拟化技术. 1.通过系统上的相关目录或文件判断 ll /proc/   ps: /proc目录 ...

  2. 360浏览器不能打开CSDN登陆页面

    碰见个奇葩问题: 使用360浏览器(广大程序员不要鄙视我~ 我有我的理由)不能打开csdn的登陆页面~~你登陆的时候,他就一直在那里打转~~ 但是用ie就可以打开登陆页面.... 怎么回事???难道C ...

  3. Swift:Minimizing Annotation with Type Inference

    许多程序猿更喜欢比如Python和Javascript这样的动态语言,因为这些语言并不要求程序猿为每个变量声明和管理它们的类型. 在大多数动态类型的语言里,变量可以是任何类型,而类型声明是可选的或者根 ...

  4. python模块：网络协议和支持

    python模块:网络协议和支持 webbrowser 调用浏览器显示html文件 webbrowser.open('map.html') [webbrowser - Convenient Web-b ...

  5. Matplotlib Toolkits：python高级绘图库seaborn

    http://blog.csdn.net/pipisorry/article/details/49515745 Seaborn介绍 seaborn (Not distributed with matp ...

  6. Swift基础之自定义PUSH和POP跳转动画

    之前用OC代码写过PUSH和POP的转场动画,闲来无事,将其转换成Swift语言,希望对大家有帮助,转载请注明.... 如何实现PUSH和POP的转场动画? 首先,创建一个NSObject的类,分别用 ...

  7. Angular2入坑指南

    序 对后端开发来说,前端是神秘的,眼花缭乱的技术,繁多的框架,出名的不出名的好几百种,看是"繁荣",其实显得杂乱无章,但是我们在做开发的时候,技术选型还是主流的那么几个:浅析ang ...

  8. The Zen Programmer

    专注 何为专注 关于 休息 怎么睡觉 心无杂念 我的体会 自我分析 初学者心态 无我 不要设置职业目标 敏事慎言 正念 做自己的老板 玩物养志 结语 最近在研读Christian Grobmeier ...

  9. Swift基础之对FMDB第三方的使用方法

    相信大家都熟悉OC使用FMDB第三方库,进行数据库操作,增.删.改.查,现在我就来利用代码展示一下Swift对此库的使用方法,我是通过Pods添加的第三方库,如果手动添加记得创建桥接文件,在文件中调用 ...

  10. 剑指Offer——京东校招笔试题+知识点总结

    剑指Offer--京东校招笔试题+知识点总结 笔试感言 经过一系列的笔试,发觉自己的基础知识还是比较薄弱的,尤其是数据结构和网络,还有操作系统.工作量还是很大的.做到精确制导的好方法就是在网上刷题,包 ...