今年写代码时越来越觉得原来的剪辑库的使用率不是很高。所以最近特别的整理了一下，简化了原来的文件，只三个，一个是HTML一个CSS一个组件。组件部分以后会不断增加！

Editplus.ctl.zip

如果不清楚如何设置与使用请查看：

http://www.andymao.com/andy/post/syntax_document.html

写完“无序列表”和“有序列表”之后已经有人和我说这两篇看得没什么意思。这两篇文章如果只以单向读取的形式阅读那么的确是没什么意思，但是这两篇重要的地方就在于要读者加入自己的思考。有序无序单标签很简单，只要知道用法就行，但是关键点我认为不在于知道这个标签长什么样，重点是在于什么样的数据适合使用什么样的列表。什么样的数据是有序的，什么样的数据是无序的？阅读完要思考，这样才能学到东西，知识才能是自己的。

定义列表其形式特别，用法也很特别，相比较无序列表来说用到定义列表的就少很多。也有很多朋友还没有开始使用这个列表，那么下面就来分解一下这个列表的代码：

1. <dl>
2.  <dt></dt>
3.  <dd></dd>
4. </dl>

看上面这段代码我们发现这里并没有出现<li>标签，而是由DL、DT、DD三个标签组成，根据外型以及之前的列表我们可以知道，DL是这个列表的一个容器，就像个箱子，不同的是这次箱子里不只有统一标准的单个小盒子了。而是出现两个不同的内容我们怎么理解这个DT与DD呢？从语义上来讲，DT是名称，是标题，而DD是解释，是内容。DT与DD都是盒子，DD只对应解释他上面的一个DT，不能越级或是向下解释。当DT不存在的时候那么DD也就没有存在的意义，而DT是否一定需要DD跟随其后，这点上我还没有找到确切的文献可以说明这一点，但是以我对于定义列表的理解，我认为如果数据中只有DT没有DD那么这就一不能成为定义列表，直接用UL无序列表就可以了。但是当数据中只有某一个或是少数几个没有DD，而大部分都有DD，那么我认为这种形式是可以存在的。

1. <dl>
2.  <dt>有序列表</dt>
3.  <dt>有序列表</dt>
4.  <dt>有序列表</dt>
5.  <dt>有序列表</dt>
6.  </dl>

 上面这种形式则我个人认为是可行的。那么一个DT是否可以带多个DD呢？这点上我同样没有找到文献说明不可以，并且在一些知名的网站中这种一个DT带多个DD的依然很多。我对此的看法是，物殊情况下一个DT带多个DD是可以的，但是一般情况上我认为这种做法还是有所欠缺。从释上来看，多个DD是否表明着多个解释？或是解释内容要分段也不需要让DD来当这只抓耗子的狗。一个DD中完全可以内嵌很多个段落标签。再则从样式应用上来讲，多个DD整体松散，其设计的扩展性不足。比如，当我们要做一个点击DT隐藏对应的DD的效果时，这种多DD的做法就不那么好实现了。所以在不是特殊用途情况下尽可能不要使用一个DT带多个DD的做法，还是把内容放在DD里，分段的就让段落标签去做，分列表的就让有序或是无序列表去表现。

还是开始讲的，标签本身没什么，重点要思考如何应用。下面给一张图大家看一下是否应该使用自定义列表。一起讨论一下。 

信息有时候是无序归纳的，有的却有着明确的顺序，在上一篇也提到了。那么简单的来想一下身边有哪些事物是有先后顺序的：操作步骤、排行榜、书目录……以前我们面对这些有着顺序或是有数字注明排序的内容时大多是在数据前自行加上一个数值，或是由程序加上这个数值。而如果使用有序列表则不需要这么麻烦，根本不用自行去填写序数，当单层列表的时候这种特性似乎并不明显，而当使用多层的时候其特性就很明显了。那么还是先来了解一下有序列表的代码形式：

1. <ol>
2.  <li>这就是列表的内容了，这是第一句</li>
3.  <li>这就是列表的内容了，这是第二句</li>
4.  <li>这就是列表的内容了，这是第三句</li>
5.  <li>这就是列表的内容了，这是第四句</li>
6.  <li>这就是列表的内容了，这是第五句</li>
7. </ol>

 大家看到了其本形式与无序列表的一样，只是在外围标签上名称不同。无序是UL，有序就变成OL了。所不同的是有序列表将会有比无序更多的标签属性。因为是有序的就会涉及顺序的方方面面。

改变开始值

通常情况下浏览器会从阿拉伯数字“1”开始自动有序编号。而事有特殊，当有序列表需要变成两个部分，那么下一部人从头开始编号自然就是不对的了。那么下一部分的编号自然是要根据上一段最后一个编号加1为开始号。这就是说我们需要改变列表的开始值。改变开始值的属性是："start"，正式的写法是：

6. <ol start="6">
7.  <li>这就是列表的内容了，这是第一句</li>
8.  <li>这就是列表的内容了，这是第二句</li>
9.  <li>这就是列表的内容了，这是第三句</li>
10.  <li>这就是列表的内容了，这是第四句</li>
11.  <li>这就是列表的内容了，这是第五句</li>
12. </ol>

大家注意到了，上面这段代码是说列表的开始值是从6开始的，那么现在可以试着在一段有序列表中加入这一属性看看是否发生了变化？

改变编号类型

浏览器中默认一般都是阿拉伯数字为列表编号，那么是否可以有别的类型呢？有，属性为“type”，不过提供的类型不多，只有五种：

 在代码中的写法应该是：

11. <ol type="A">
12.  <li>这就是列表的内容了，这是第一句</li>
13.  <li>这就是列表的内容了，这是第二句</li>
14.  <li>这就是列表的内容了，这是第三句</li>
15.  <li>这就是列表的内容了，这是第四句</li>
16.  <li>这就是列表的内容了，这是第五句</li>
17. </ol>

我认为这个类型值大家还是少用为好，因为用CSS一样可以设置这个类型。我一向主张样式方面的事应由样式语言来做。那么除非特殊原因，这个属性还是不用为好。当然无论是CSS1还是CSS2基本上都没考虑中国，在CSS2中已经为提供了日文编号字符，可是还没有中文。我认为在这点上CSS2还是有着缺陷的，至少他没有提供更好的扩展形式。虽然他没提供，但是我们一样可以用我们自己的形式去完成多样化。怎么做呢？请大家先思考，后面有关于列表的样式内容将会讲述我是如何处理的。

段落已经讲完了，那么一些基本的应用方式也讲了一些，那么是否已经应用了呢？当然应用可以更为丰富，那么这些就需要自己在实际工作中不断的摸索与思考，然后创新并总结得出新的应用形式。当然了段落不能当作万用膏药一样倒处使用，不过相信大家也都知道现在“DIV”这个标签的作用已经被扩大化了（POPO曾有一篇文章《<DIV>不是万能膏药》），更已经被一些人拿来与CSS一并说事。这里呢还是要重新强调一次：DIV只不过是HTML中的一个无语意标签，他可以用来布局或是作为无语意部分的处理，而CSS则是一种样式语言。名不正则言不顺，我这里不是古板，而是这种说法会让大家对于标准的理解会产生偏颇。基本的等级都弄不清楚，把标签功能无限放大，这些都不是一个正确的学习态度。我这里细细讲解各种标签以及用途其中一点也是希望大家正确理解WEB标准的意义。正确的说法应该是“xHTML+CSS”或是“WEB标准”简称为“标准”也可以。今天不是为发牢骚的，还是讲今天的主题《无序列表》

列表，相信大家都已经用过了，Word里也有，很多文档编辑里也都有。而在HTML中的列表则有三种类型：无序列表、有序列表、定义列表。饭要一口口的吃，事要一件件的做，今天只讲无序列表，并且今天所讲的列表不会涉及到CSS的美化工作。说到这里大家应该也明白了，我的讲解都是分开来的，并不以样式美化为主，这也是要告诉大家标签代码非常重要。那么我们首先就要来理解列表。我们日常生活工作都是琐碎而没有条理的，而要想得到一个高效的友好的信息互通那么就要梳理信息，做好归类。这样才能有效传达信息。用列表把同类的内容进行简单的归纳，我认为这是列表的一个基本作用。常见的用途有：图书目录、饭店菜单、人员名单、待办事宜等等。而这些信息大多不是大篇的信息内容，而是简要的标题。当然列表的用途不是说只能是归纳标题信息，列表并没有去限制内容的多少。只是我们常用列表去归纳的多是些标题信息罢了。

那么我们又如何去理解无序列表呢？无序的对应就是有序，从字面上去理解就很容易，有序就是说他本身就标明了前后顺序的，这是严格的，并且这些信息本身就有着顺序特性。比如我们写操作步骤那就就需要明确第一步第二步，这样的信息必然是有序的，而无序呢？也就是说其本身就是无序的没有任何顺序可言。这里要举个实例让大家思考一下：政府部门的领导名单前后顺序是他们最头疼的事，虽然他们有时会写着排名不分先后，但是实际上依然是有排名的，那么这里我想提出问题：这样的名单应用有序列表还是用无序列表呢？当然这个没有标准答案，各人都有各人的思考方式，那么你是怎么想的？不妨在评论上留下你的想法。这里我就不说我是怎么想的，希望大家能多动动脑筋，多思考。

列表的标签形式是：

1. <ul>
2.  <li>这就是列表的内容了</li>
3.  <li>这就是列表的内容了</li>
4.  <li>这就是列表的内容了</li>
5.  <li>这就是列表的内容了</li>
6. </ul>

 这里我们要注意到，列表有两个部分，一个是最外面的一个标签<ul></ul>，一个是里面的内容<li></li>。我们可以这样去理解，<li></li>是一个个标准化的小盒子，他们主要存放着列表信息，而<ul></ul>则是个大箱子，他的作用就是存放小盒子。这些一个个的小盒子只有放在大箱子里他们才不会弄丢了。整齐而有利于运输（移植）、存放（定位）。那么列表与段落一样可以有很多属性在其中，比如，我们可以为<ul></ul>设置一个id或是class或是title等属性，其特点功用与段落中的一样。而<li></li>也可以有这些属性，但是一般情况下来说列表即然是同类的一般也不作特殊化处理。

那么无序列表基本上也就算是讲完了，其实这篇最重要的内空就是什么样的信息应该用无序列表，而这些则需要在实际应用的时候多分析多思考。那么对于还没使用列表标签的朋友，开始使用列表标签，放弃用DIV代替列表标签的做法。或是用表格来表现列表的朋友也可以试着改变一下。从现在开始使用无序列表标签。当然如果你已经用了发现这样还不能满足你，那就等后面讲解如何用样式去开发出列表的潜力吧。今天讲的内容虽然比较简单，但是还是希望来读本篇文章的朋友可以思考一下上面我提出的问题。

延伸阅读：

• <DIV>不是万能膏药—— POPO
• XHTML结构的重要性 —— 毅博客
•  

南京的炎炎夏日也未能挡住书友会朋友们的参与，下午两点半我们正式开始了这个月的话题：“浏览器”。一开始大家大致上说了一些自己认为各浏览器中各自认为很有特点的一些服务或是功能特点。由于大家都属于专业用户所以大部分人还是很倾向于使用FIREFOX，原因也都差不多，FIREFOX这种以扩展形式来丰富浏览器应用对于用户来讲很方便也比较容易组合出适合自己使用的浏览器。这种特点可能是FIREFOX吸引人的地方也同样可能是影响FIREFOX发展的暂时的一个障碍。因为大部分使用浏览器的人并非是专业用户，他们并非是做互联网行业的，对于这些用户来说最简单最直接的浏览器就可以了，如果需要下载无数的插件才能满足使用可能会觉得无从下手。

有困难就会有解决方案，FIREFOX也可以采用针对特定的用户群体制作出集成了常用插件的浏览器文件提供下载。事实上Maxthon能被很多人喜欢并接受，我认为很大一部分原因是他从一开始就提供了丰富的功能，并且从一开始就设置好了一般性使用方案，那么当用户安装好后马上就可以使用了并不需要花时间去下载插件，也不需要再动手设置什么。丰富的功能，简单的获取，便捷的使用，我想这就是Maxthon成为大众所喜欢的浏览器的重要原因。然从这里我们可以看出用户类型是多样的，那么浏览器的未来发展将要面对并满足不同群体的使用需求。

对于开发者来说浏览器具备良好的开发辅助功能那是最好不过的，比如可以看到当前浏览网站的IP、PageRank、Alexa、JS、CSS等等，那么对于这一类群体来讲方便于开发的浏览器就是最适合与贴切的。当然社会群体会有很多比如：家庭主妇，她使用浏览器无非是上网，未来可能更多是在线上看一下哪些产品好，然后从淘宝或是易趣或是拍拍上购买自己的产品。那么浏览器是否提供了丰富针对购物者的浏览器呢？购物者在购物的时候需要哪些特别的帮助？需要哪些附加的功能？再比如：学生，他年轻，有活力，比较喜欢玩，那么对于娱乐内容就更为看重。那么作为一个学生来讲，他们对于浏览器的需求又是什么？当然类型会有很多，或许类型并不以此来作为一个分类标准。但是无论如何，浏览器将会以多样性丰富我们的生活。

在讨论的时候大家思考的都不一样，立足点也不同，以至于已经讨论到未来世界的互联格局，骇客帝国的例子也被列举。也说到了未来浏览器与操作系统之间会变得很模糊，因为目前来看很多事都可以通过浏览器在网上实现了，那么作为操作系统存在的必要性还有多高？因为从目前来看，我们的数据可以存储在网上，我们可以在线看视频听音乐，和别人聊天，甚至在线处理Office文档。这是一个大趋势，未来浏览器的重要性的确会比操作系统高很多，因为操作系统的作用已经在减弱，那么什么事都可以在线处理的时候我们的生活也就会世大的改变。我们不会再被终端拖累，人会变得更加的自由。

当然多样性的特点也告诉我们，即使如此现有的这种操作系统也不会突然消失，因为目前来看在线处理还只能是一般性或是初级事物，而一些比较大数据处理，或是安全要求高的数据处理还需要依靠单机运行。但是少数的情况不会影响大局走势。未来可以去假设、想像、规划，但是着眼于当下可能是最为务实的。

最后提供几个我常用的FIREFOX扩展：

• IE TABhttp://ftp.mozine.cn/addons/extensions/ie_tab/ie_tab-1.5.20080618-fx-windows.xpi
• Tab Mix Lite CE  http://ftp.mozine.cn/addons/extensions/tab_mix_lite_ce/tab_mix_lite_ce-3.0-fx.xpi
• Easy DragToGo   http://ftp.mozine.cn/addons/extensions/easy_dragtogo/easy_dragtogo-1.1.2.1-fx.xpi
• Add to Search Bar     http://ftp.mozine.cn/addons/extensions/add_to_search_bar/add_to_search_bar-1.7-fx.xpi
• SearchStatus     https://addons.mozilla.org/zh-CN/firefox/downloads/file/28983/searchstatus-1.25-fx.xpi

 扩展阅读：

•  UCDChina书友会话题之“浏览器”——卓岚
• 浏览器——web世界之门—— 沈彤辉
• 2008-07 UCD China 南京书友会——袁亮