讲给后台程序员看的前端系列教程(06)—

C语言自学完备手册(33篇)

Android多分辨率适配框架

HTML5前端开发实战系列教程

MySQL数据库实操教程(35篇图文版)

推翻自己和过往——自定义View系列教程(10篇)

走出思维困境，踏上精进之路——Android开发进阶精华录

讲给Android程序员看的前端系列教程(40集免费视频教程+源码)

版权声明

本文原创作者：谷哥的小弟
作者博客地址：http://blog.csdn.net/lfdfhl

之前，我们已经学习了HTML常用标签、HTML文本标签、HTML语义标签、HTML结构标签；现在我们来继续学习HTML中常用的列表标签。

HTML列表标签

ul标签

可能猛地一下看到ul不知道它是干嘛的。可是，如果我告诉你它源自于英语短句unordered list，你是否就反应过来了呢？对的，它用于表示无序列表。请看如下示例：

<ul><li>华为</li><li>三星</li><li>小米</li><li>锤子</li>
</ul>

ol标签

看到ol，调皮的同学一下子就想到了office lady，办公室的白领丽人。嗯哼，不好意思，你想多了，此处的ol源自于英语短句ordered list，它用于表示有序列表。请看如下示例：

<ol><li>状元</li><li>榜眼</li><li>探花</li>
</ol>

dl标签

dl标签表示自定义列表，它源于英语短句definition list。请看如下示例：

<dl><dt>中国古典四大名著</dt><dd>红楼梦</dd><dd>三国演义</dd><dd>西游记</dd><dd>水浒传</dd><dt>高尔基自传三部曲</dt><dd>童年</dd><dd>在人间</dd><dd>我的大学</dd>
</dl>

源码和页面

在此，附上本节教程源码：

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>列表标签</title></head><body><!-- ul标签用于无序列表 --><ul><li>华为</li><li>三星</li><li>小米</li><li>锤子</li></ul><!-- ol标签用于有序列表 --><ol><li>状元</li><li>榜眼</li><li>探花</li></ol><!-- dl标签用于自定义列表--><dl><dt>中国古典四大名著</dt><dd>红楼梦</dd><dd>三国演义</dd><dd>西游记</dd><dd>水浒传</dd><dt>高尔基自传三部曲</dt><dd>童年</dd><dd>在人间</dd><dd>我的大学</dd></dl></body>
</html>

效果如下：

讲给后台程序员看的前端系列教程(06)——HTML5标签(5)相关推荐

讲给后台程序员看的前端系列教程(02)——HTML5标签(1)
C语言自学完备手册(33篇) Android多分辨率适配框架 HTML5前端开发实战系列教程 MySQL数据库实操教程(35篇图文版) 推翻自己和过往--自定义View系列教程(10篇) 走出思维困境 ...
讲给后台程序员看的前端系列教程(19)——CSS的层叠性与继承性以及优先级
C语言自学完备手册(33篇) Android多分辨率适配框架 HTML5前端开发实战系列教程 MySQL数据库实操教程(35篇图文版) 推翻自己和过往--自定义View系列教程(10篇) 走出思维困境 ...
讲给后台程序员看的前端系列教程(11)——HTML综合练习
C语言自学完备手册(33篇) Android多分辨率适配框架 HTML5前端开发实战系列教程 MySQL数据库实操教程(35篇图文版) 推翻自己和过往--自定义View系列教程(10篇) 走出思维困境 ...
讲给后台程序员看的前端系列教程(38)——事件处理
C语言自学完备手册(33篇) Android多分辨率适配框架 HTML5前端开发实战系列教程 MySQL数据库实操教程(35篇图文版) 推翻自己和过往--自定义View系列教程(10篇) 走出思维困境 ...
讲给后台程序员看的前端系列教程(52)——Bootstrap轮播图
C语言自学完备手册(33篇) Android多分辨率适配框架 JavaWeb核心技术系列教程 HTML5前端开发实战系列教程 MySQL数据库实操教程(35篇图文版) 推翻自己和过往--自定义View ...
讲给后台程序员看的前端系列教程(40)——canvas
C语言自学完备手册(33篇) Android多分辨率适配框架 HTML5前端开发实战系列教程 MySQL数据库实操教程(35篇图文版) 推翻自己和过往--自定义View系列教程(10篇) 走出思维困境 ...
写给程序员看的“幻灯片”制作教程
大家好,我叫谢伟,是一名程序员. 如果你比较关注国外开发者大会,你经常可以看到,一些程序员分享一些在线可以查看的"幻灯片",当然这里的幻灯片和微软 Office 旗下的 Power ...
黑马程序员pink老师前端入门教程，零基础必看的JavaScript基础语法视频教程（一）
一.计算机编程基础编程语言编程语言与标记语言的区别编程语言有很强的逻辑和行为能力,有if else等具有逻辑性和行为能力的指令,主动标记语言(html)不用于向计算机发出指令,常用于格式化和 ...
黑马程序员pink老师前端入门教程，零基础必看的JavaScript基础语法视频教程（jQuery1）
jQuery概述 JavaScript库 jQuery概述 jQuery优点 jQuery的基本使用入口函数 jQuery的顶级对象$ DOM对象和jQuery对象 DOM对象和jQuery对象相互 ...

讲给后台程序员看的前端系列教程(06)——HTML5标签(5)