Notepad++：分析博客模板的好帮手
收藏此页到365Key 
前面的文章中介绍了编辑博客模板的基本常识，包括 HTML 语言，CSS 样式表 和 简单的模板布局方案 等。然而，这些都是比较浅显的入门知识，现实中使用的博客模板是非常复杂的，仅仅了解这些内容远远不够，要想真正从头设计，还需阅读很多现有的博客模板代码，借鉴其它人的经验。在这里，我向您推荐一款开源免费的文本编辑器：Notepad++，它可以在您阅读网页代码时给您很大帮助。
Notepad++ 如何给代码阅读带来帮助呢？如前面的教程中讲到的，HTML 代码是成对的网页标签层层包裹的结构，而在博客模板中，通常是用 div 这种矩形块来布局。所以，要理解模板结构，首先应当看到最外层的 div 标签是如何排放的，这样就看到了整个模板的框架，随后再分析每个 div 内部的代码就可以逐步把握整个博客模板的结构了。Notepad++ 有一个很棒的功能，那就是将网页代码显示为可折叠的形式，当您不关心一对标签内部的结构时，可以轻松地将这部分内容折叠起来，只留下您感兴趣的部分。
左图是 我的博客首页 的模板代码，如果您直接在页面上点击右键并选择查看源代码的话，恐怕立刻就会被一坨一坨的标签搞得头晕眼花，但当您将我的首页另存为 HTML 文件并在 Notepad++ 中打开时，就可以看得清楚些。经过一些简单的折叠动作便可以看到页面的总体框架：最外层用 id 为 container 的 div 包裹，里面有四个 div，顶部是 banner，底部是 footer，中间的两部分分别是 content 和 sidebar。当然如果不参考样式表的话还不能直接看出 content 和 sidebar 其实是并列的。
那么该如何查看 CSS 样式表呢？如果您将一张网页完整地存储到本地，CSS 样式表通常就位于和网页同名的 .files 目录里。Notepad++ 识别 CSS 样式表的语法，也可以用它查看和修改 CSS 样式表，编辑时还可以通过快捷键调出输入提示，减少重复乏味的属性名拼写。除了 HTML 和 CSS 之外，Notepad++ 还支持很多其它编程语言的语法高亮，如果对默认的字体配色方案不满意，还可以自行设定。因为是绿色软件，Notepad++ 的设置信息都保存在程序目录下，即使复制到其它机器上运行，配置也不会丢失，所以特别适合放在优盘上使用。
当然 Notepad++ 并非没有缺点，如果某个博客首页的代码写得不规范，它也可能对网页的结构做出错误的分析。比如我曾在一篇文章中嵌入一个媒体文件，但没有严格按规范书写，只写了 <embed ...> 而没有写关闭标签 </embed>。结果 Notepad++ 就把它和后面紧邻的 </div> 配对了；此外，一定让重要的起始标签另起一行，比如 <head>...</head><body> 这样的写法就会造成折叠 <head> 标签的时候把整个 <body>...</body> 都隐藏掉。要避免这种情况，利用查找替换功能将代码中所有的 "><" 都通过正则表达式替换为 ">\n<"即可。
也许有些朋友会问，我听说设计网页都用 Dreamweaver，没怎么听过这个 Notepad++ 啊？个人认为 Dreamweaver 是设计整个网站的时候才需要的工具，用来设计博客模板会有大材小用的感觉。其实我用过的网页编辑工具中最棒的当属微软的 VS.NET 2005，不仅启动速度超快，对网页代码分析纠错的能力也很强，还能根据代码结构重新缩进，使代码层次分明，更具可读性。遗憾的是它是个体积超过 2 G 的大家伙而且价格昂贵，除了专业编程人员，恐怕没人会考虑用它来编辑博客模板了。
其它推荐软件：TopStyle(精简版免费)，UltraEdit-32(收费)
09/04,2006, at 08:57
回到学校了，然后发现一个问题，我们学校的教育网访问不了南开bbs，郁闷中……
09/04,2006, at 14:33
:-p zanshi wufa shuru zhongwen le, hehe, xian chuansuo zixia ba
09/06,2006, at 01:13
不错的软件哦。其实用用vim或者emacs也是不错的选择。
09/06,2006, at 14:55
:D vim 我也喜欢用，还没有研究透，Emacs 太复杂了，等有时间再说吧。
09/07,2006, at 18:45
这个没用过，一直用ff加web developer插件也不错，比较简单
12/11,2006, at 09:21
我想知你这个CSS样式怎么样能存入数据库里呀,然后在前台看到我所选择的样式
12/11,2006, at 16:28
to 延枫 :-D CSS 样式不用存入数据库啊，都是直接存硬盘上的。
12/19,2007, at 16:56
=(
我的博客页面，因为擅自修改CSS，字体变得好大……又没有备份…
12/20,2007, at 13:18
:-D 正常的，本来就该早点“擅自修改”，要不然怎么会有进步呢？
03/24,2008, at 23:47
请抵制notepad++，因为这个垃圾在网站首页http://notepad-plus.sourceforge.net号召抵制北京奥运会。
03/26,2008, at 00:17
楼上这位。。。。
抵制就像报仇，江湖恩怨何时了
何况我已隐退~
03/26,2008, at 16:22
:o 表说那么沉重，生活需要一点个性
04/14,2008, at 22:02
谁让他先抵制北京2008的
坚决抵制它！
07/29,2008, at 17:16
权利是我们的必须 盛会是君主的游戏 别人为我们争取必须 我们却责怪他破坏了君主的游戏 国人何时醒来？
07/30,2008, at 18:50
楼上那位你永远隐退不了
如果国人都像你说的那样，那我们不是又回到任人宰割、任人侵略的年代了吗
醒醒吧 别人已经指名道姓的侵犯了。。
07/20,2009, at 15:06
Great post! I