本文已参与「新人创作礼」活动，一起开启掘金创作之路。
目录（6、列表-基础语法 ）
一、前言
上一篇文章我整理以前的笔记是：同一页面上不同位置之间的跳转，详细可参考博文 [web快速入门之基础篇-html：5、同一页面上的跳转（锚点等知识点）] 这篇文章我将整理知识：列表-基础语法
二、实例演示
实例代码
我们先来看看一个例子，如下代码：01_基础语法.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>这是title标题</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
</head>
<body>
<h3>有序列表</h3>
<ol>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
</ol>
<h3>无序列表</h3>
<ul>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
</ul>
</body>
</html>
效果演示
用谷歌浏览器打开运行，效果如下：
编辑
三、知识点说明
基础语法
如：
<ol>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
</ol>
<ul>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
</ul>
目录（ 7、列表-实际应用-嵌套列表）
一、前言
上一篇文章我整理以前的知识是：列表的基础语法 ol、ul、li 标签的使用，详细可参考博文 【web快速入门之基础篇-html：6、列表-基础语法】 这篇文章我将整理知识：列表-实际应用-嵌套列表，也就是主要介绍 ol、ul、li 标签的嵌套使用，实现分级菜单的一些知识
二、实例演示
实例代码
我们先来看看一个例子，如下代码：02_嵌套列表_实际应用.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>这是title标题</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
</head>
<body>
<h3>---直接使用---</h3>
<ol>
<li>书</li>
<li>家电</li>
<li>日用品</li>
</ol>
<h3>---嵌套的列表---</h3>
<ol>
<li>个人所得税
<ul>
<li><a href="#问题1.1">问题</a></li>
<li><a href="#方案1.2">方案</a></li>
<li><a href="#实现1.3">实现</a></li>
</ul>
</li>
<li>其他税收介绍
</li>
</ol>
<img src="if.jpg" width="450"/><br/>
<a name="问题1.1">这是问题</a><br/>
<img src="if.jpg" width="450"/><br/>
<a name="方案1.2">这是方案</a><br/>
<img src="if.jpg" width="450"/><br/>
<a name="实现1.3">这是实现</a><br/>
<img src="if.jpg" width="450"/><br/>
</body>
</html>
效果演示
用谷歌浏览器打开运行，效果如下：
注：由于太长，只截取了一半图片。但列表功能实现有了，后面只是一些超链接的图片
编辑
三、知识点说明
实际应用
应用一:直接
- 书
- 家电
- 日用品
应用二:嵌套的列表---分级菜单
