HTML的本质知识.docVIP

HTML的本质知识 HTML学习的本质就是该是什么就用什么——Ghost。当然这句话是需要一个解释的，参照的范例就是你的小学语文书。 我们先来看看我们制作网站的历程。记忆中我第一个网站是产生于1998年，当时都是一群用table做网页的人。在table的时代我们觉得最难的题目是什么？ 奇特的三行不定列布局： 奇特的一像素边界： table时代过后（记忆中是2001年前后），出现了第一批使用div的人。于是国内吹起了一股CSS之风。用法是将他套着若干的table然后利用CSS的绝对定位，还有的加上些JS让他飘来飘去。后面就有人开始研究CSS起来，记得“风人设计”的初期就有若干谈合作的人拿着一本CSS的书和我说这说那的（当然这些人最后都转行了）。在这个时候我们觉得最难的题目是做一个当时被叫做“Java特效”的咚咚。于此时我被一个人提出的XML所吸引，但只是将他看作一种数据储存（其实这也就奠定了Qzone实现的雏形）。 时间飞快如梭，2004年5月1日，国际劳动节当天，电子工业出版社出版了一本名为《网站重构——应用Web标准进行设计》的书译。于是国内就遍布了“DIV+CSS”的信念，真正的意味上中国网站重构的跨时代性起步开始了；但另一个角度而言，这本书将中国的WebReBuilder从一个火坑拉出来，丢进了另外的一个火炕。我想我们只能使用看待隋唐盛世的眼光去看待这本书。因为它只是意味一革新的皇帝和新的朝代的诞生，并没有从本质上面推动社会的变革和进化。这本书将table嵌套，变成了div嵌套。当时最流行的话语（直到现在）是“我的网站是‘DIV+CSS’做的。”这个时候我并没有加入这个行列，一直是在等待；因为我有一个很关键的问题没有解决“为什么要‘DIV+CSS’而不是‘TABLE+CSS’”： 引用《这将是一场革命》内容：我们先看看一下两个范例。table做的，div做的表面上他们是一样的，但是一旦产品经理提出修改，表现需要变化。对于div会很轻易的变化成为这个 范例 。范例可以看出不修改html的情况下，table就是打死也完成不了这样的改变。“DIV+CSS”比“TABLE+CSS”优秀就是排版的自由化，就以上例为题，table就一辈子都无法做到。 一直到了Qzone3.0前后，我才开始想明白上面的答案，历时差不多有一年。接着在Qzone4.0的时候动用了三个标记“dl、dt、dd”和 TMENU 的诞生。现在非常悔恨的是我也将大家带入了另一个跨时代的起步——“XHTML+CSS”，同时也是将大家带进了一个新的火炕。进火炕容易出火炕难，我才开始明白为什么两个重构名人——阿捷、老甘会在互联网当中逐渐消失。我开始不去怪责他们之前的事情，更多的是一种体谅，与此心中也暗下决心。便开始了进行铺垫“良性竞争”的“SB”观念。历史路程如上，回归到HTML学习的本质就是该是什么就用什么；意思就是标签不能滥用，还原到内容的本质的标签才是合格的标签。就以 TMENU 为范。 之前的HTML代码是： ul class=menulia href=#spanspan123123/span/span/a/lilia href=#spanspan123123/span/span/a/lilia href=#spanspan123123/span/span/a/lilia href=# class=nowspanspan123123/span/span/a/lilia href=#spanspan123123/span/span/a/li/ul 现在的HTML代码是： map id=directmenu class=menudiva href=#spanspan123123/span/span/aa href=#spanspan123123/span/span/aa href=#spanspan123123/span/span/aa href=# class=nowspanspan123123/span/span/aa href=#spanspan123123/span/span/a/div/maph2以下是一个菜单列表/h2ul class=menulia href=#spanspan123123/span/span/a/lilia href=#spanspan123123/span/span/a/lilia href=#spanspan123123/span/span/a/lilia href=# class=nowspanspan123123/span/span/a/lilia href=#spanspan123123/span/span/a/li/ul 两者的不同点，大家也看到了。多了一块map的标签和一个hn的