首先，修改主题模板的footer.php文件，</body>上面加入如下代码：

<div id="toolBackTo" style="display: none;">

    <a title="返回顶部" onclick="window.scrollTo(0,0); return false;" 

        href="#top">返回顶部</a>

</div>

上面这段代码是完全Copy自人人网的源代码。返回页面顶端的代码很简单。

接下来修改style.css文件，加入上面div和链接的样式：

.back-to {

    position: fixed;

    bottom: 10px;

    right: 10px;

    z-index: 999;

    width: 110px;

    overflow: hidden;

    zoom: 1;

    -ie6-position-fixed-delay: 200;

}



.back-to .back-top:hover {

    background-position: -50px 0

}



.back-to .back-top {

    float: right;

    display: block;

    width: 50px;

    height: 50px;

    background: url(http://a.xnimg.cn/imgpro/button/back-top.png) no-repeat 0 0;

    margin-left: 10px;

    outline: 0 none;

    text-indent: -9999em;

}

非常不好意思，这些代码也是原样copy自人人网。

.back-to就是div的样式，它的position设为fixed。这样它就会固定在页面的某个地方。在这里它的位置是bottom: 10px; right: 10px，就是右下角距离浏览器边角各10px的位置。

到这一步，基本功能已经实现了，当我们把页面滚动到下方的时候，点击这个按钮，就会自动跳到页面的顶端。

不过，当页面在顶端的时候，这个按钮其实没有存在的必要，我们可以用javascript来控制它。

再回到footer.php文件，在刚刚的代码下面加上如下代码。

<script type="text/javascript">

$(function(){

    var bt = $('#toolBackTo');

    var hl = $.browser.webkit ? $('body')[0] : $('html')[0];



    $(window).scroll( function() {

        var st = hl.scrollTop;

        show = (st>30);

        if( show ){

            bt.show("slow");

        }else{

            bt.hide("slow");

        }

    });

});

</script>

这段代码用到了jQuery，所以需要先检查一下当前模板有没有引用jQuery，如果没有的话要在header.php里引用它。

我们给window对象绑上了scroll方法，在页面滚动的时候触发来控制返回按钮所在div的隐藏和显示。

代码非常简单。

当今浏览器核心的种类值得一体的大约只有三到四个，它们分别是：Trident、Gecko、WebKit和Presto。

乍一看，似乎都很陌生，其实并不然，只要你上过网，就至少用过其中一种浏览器核心的浏览器软件，因为它们的市场占有率的确是太高了。

一、Trident核心，代表产品Internet Explorer

说起Trident，很多人都会感到陌生，但提起IE（Internet Explorer）则无人不知无人不晓，由于其被包含在全世界使用率最高的操作系统Windows中，得到了极高的市场占有率，所以我们又经常称其为IE核心。

Trident（又称为MSHTML），是微软开发的一种排版引擎。它在1997年10月与IE4一起诞生，至今经历12年，至少更新了四个版本，虽然它相对其它浏览器核心还比较落后，但Trident一直在被不断地更新和完善。而且除IE外，许多产品都在使用Trident核心，比如Windows的Help程序、RealPlayer、Windows Media Player、Windows Live Messenger、Outlook Express等等都使用了Trident技术。

但并不是所有的IE都使用Trident引擎，微软还有另一个网页浏览器排版引擎，叫做Tasman，它是使用在Internet Explorer for Mac的排版引擎，即苹果版的IE引擎。

使用Trident引擎的浏览器有很多，比如Internet Explorer、Maxthon遨游、世界之窗、腾讯TT、Netcapter、Avant等等，但Trident只能应用于Windows平台，且是不开源的。

二、Gecko核心，代表作品Mozilla Firefox

Gecko也是一个陌生的词，但Firefox的名声应该已经有所耳闻，Gecko是一套开放源代码的、以C++编写的网页排版引擎。

目前为Mozilla家族网页浏览器以及Netscape 6以后版本浏览器所使用。这软件原本是由网景通讯公司开发的，现在则由Mozilla基金会维护。它的最大优势是跨平台，能在Microsoft Windows、Linux和MacOS X等主要操作系统上运行，而且它提供了一个丰富的程序界面以供互联网相关的应用程式使用，例如网页浏览器、HTML编辑器、客户端/服务器等等。

Gecko是最流行的排版引擎之一，仅次于Trident。使用它的最著名浏览器有Firefox、Netscape6至9。

三、WebKit核心，代表作品Safari、Chrome

webkit 是一个开源项目，包含了来自KDE项目和苹果公司的一些组件，主要用于Mac OS系统，它的特点在于源码结构清晰、渲染速度极快。主要代表作品有Safari和Google的浏览器Chrome。

四、Presto核心，代表作品Opera

Presto是由Opera Software开发的浏览器排版引擎，供Opera 7.0及以上使用。它取代了旧版Opera 4至6版本使用的Elektra排版引擎，包括加入动态功能，例如网页或其部分可随着DOM及Script语法的事件而重新排版。

Presto在推出后不断有更新版本推出，使不少错误得以修正，以及阅读Javascript效能得以最佳化，并成为速度最快的引擎，这也是Opera被公认为速度最快的浏览器的基础。

一、基本规范：

页面一定要有相应的Title，特殊页面可以不要；如Iframe页、Include页等

主要页面要有meta字段以便于搜索引擎查找，还可充当注释作用

尽量使用广泛支持的技术。以流行的浏览器及版本为标准，同时照顾低版本

不使用过小的字体不使用过大的图片、动画、声音、不使用过长的滚屏

及时删除无用文件，防止无谓的下载速度减慢、后期维护简洁明了

所有文件全部以小写字母命名，包括图形文件。禁止用中文作文件名

页面支持最低800X600屏幕分辨率（实际尺寸为778*434px），即不能出现横向滚动条

通常情况下页面应以居中为主，如有特殊要求可以设置居顶、居左

图片采用gif, jpg压缩格式，以减小页面下载数据量，<img alt="" />标记要有width,height属性

所有页面都需要定义背景颜色，系统默认值是可以被用户随意更改的

二、文件命名与目录结构规则

首页面必须是以index.htm 、index.jsp命名的文件，按目录划分

HTML文件扩展文件名一律用 .htm，不要同.html扩展名混用

除非有特殊情况，目录、文件的名称全部用小写英文字母、数字、下划线的组合，其中不得包含汉字、空格和特殊字符；目录名应以英文、拼音为主。尽量用一些大家都能看懂的词汇。

目录下新建css文件夹，专门用来存放本级目录的全局CSS样式文件

目录下新建image文件夹，专门用来存放本级目录的全局图片资源，如gif、jpg

目录下新建script文件夹，专门用来存放本级目录的全局脚本程序代码，如js、vbs

目录下新建media文件夹，专门用来存放本级目录的全局媒体文件，如flash、avi

目录下新建temp文件夹，专门用来存放本级目录的临时或测试资源文件

根目录下一般只存放index页面及其所包含的帧页面与一些公共页面，如error、wait

所有文件与目录尽量符合DOS系统8/3文件格式命名，即8字节文件名、3字节扩展名

三、表格嵌套布局规范

在排布表格之前,请大家一定要好好思考一个最佳的方案,表格的嵌套尽量控制在三层以内,并且应该尽量避免 两个标记,经验表明,这两个标记会带来许多麻烦。

一个网页要尽量避免用整个一张大表格,所有的内容都嵌套在这个大表格之内,因为浏览器在解释页面的元素时,是以表格为单位逐一显示,如果一张网页是嵌套在一个大表格之内,那么很可能造成的后果就是,当浏览者敲入网址,他要先面对一片空白很长时间,然后所有的网页内容同时出现。如果必须这样做,请使用<tbody>标记,以便能够使这个大表格分块显示。

排版中我们经常会遇到需要进行首行缩进的处理,不要使用 或者全角空格来达到效果,规范的做法是在样式表中定义 p { text-indent: 2em; } 然后给每一段加上<p>标记,注意,一般情况下,请不要省略</p>结束标记 。

原则上,禁止用 <img alt=”" width=”?” height=”?” /> 来人为干预图片显示的尺寸,而且建议 <img alt=”" /> 标签中不要带上 width 和 height 两个属性,这是因为制作过程中,图片往往需要反复的修改,这样可以避免人为干预图片显示的尺寸,尽可能的发挥浏览器自身的功能；但是这样的一个副作用是当网页还未加载图片时,不会留出图片的站位大小,可能会造成网页在加载过程中抖动（如果图片是插在一个固定大小的表格里的,不会有这个现象）,尤其是当图片的尺寸较大时,这种现象会很明显,所以当预料到这种会明显导致网页抖动的情况会发生时,请大家务必在最后给 <img alt=”" /> 附上 width 和 height 属性。

为了最大程度的发挥浏览器自动排版的功能,在一段完整的文字中请尽量不要使用<br>来人工干预分段。

不同语种的文字之间应该有一个半角空格,但避头的符号之前和避尾的符号之后除外汉字之间的标点要用全角标点,英文字母和数字周围的括号应该使用半角括号。

请不要在网页中连续出现多于一个的半角空格, 也尽量少使用全角空格（英文字符集下,全角空格会变成乱码）,空白应该尽量使用 text-indent, padding, margin, hspace, vspace 以及透明的 gif 图片来实现。

中英文混排时,我们尽可能的将英文和数字定义为 verdana 和 arial 两种字体。

行距建议用百分比来定义,常用的两个行距的值是 line-height:120%/150%

网站中的路径全部采用相对路径,一般链接到某一目录下的缺省文件的链接路径不必写全名,如我们不必这样：<a href=”aboutus/index.htm”> 而应该这样：<a href=”aboutus/”></a>

四、Web标准设计规范（XHTML+CSS）

为页面添加正确的DOCTYPE，过渡型（Transitional）、严格型（Strict）、框架型（Frameset）

设定名字空间（Namespace）

声明编码语言

用小写字母书写所有的标签元素与属性名字

为图片添加 alt 属性

给所有属性值加引号””

关闭所有的标签，包括空标签

用CSS定义元素外观

用结构化元素代替无意义的垃圾代码

给每个表格和表单加上id

所有的XML标记都必须合理嵌套

把所有<>和&特殊符号用编码表示； &lt; &gt; &amp;等

给所有属性赋一个值，没有值的就重复本身

不要在注释内容中使用“–”

推荐定义font-family : “Lucida Grande”, Verdana, Lucida, Arial, Helvetica, 宋体,sans-serif;

辅助图片一律用背景处理

尽量多使用群选择器、派生选择器来书写具有层次结构的CSS样式

合理使用类别选择器与id选择器，同个ID只用一个地方，相同CLASS可用多个地方

链接伪类一定要按照a:link、a:visited、a:hover、a: active的顺序书写

多使用具有良好风格的注释，便于今后的维护与重构

HTML编码规范

一个标记必须占用一行 不得出现两个标记在同一行的情况(同一标记的关闭标记除外)

静态文件内容必须包含在标记中间

标记必须包含在标记中间

对于需要关闭的标记，必须同其关闭标记同时出现，不得出现交叉包含的语句

最高一级的父标记采用左对齐顶格方式书写

下一级标记采用左对齐向右缩进一个Tab的方式书写

在下一级依此类推，分别左对齐相对于父标记向右缩进一个Tab的方式书写

同一级标记的首字符上下必须对齐

JavaScript编码规范

变量命名规范

常量以及全局变量名必须全部使用大写字母

变量名首字母必须小写

变量名必须使用其类型的所写字符串开始。各种类型的所写字符串如下：

整型变量：int；长整型变量：lng；浮点型变量：flt；双精度变量：dbl

对象引用变量：obj；字符串变量:str；Date类型变量：dtm

变量名必须采用有意义的单词命名

变量名除首字母小写外，其他单词首字符必须大写

如果变量名过长可以使用单词缩写，除了被广泛了解的单词缩写以外，所有使用单词缩写的变量名必须在定义时给出注释

变量使用规范

变量使用前必须定义。没有定义的变量禁止使用

变量的使用尽量缩小到小的作用域

对象命名规范

text输入框：txt button按钮：btn select下拉选择框：sel option项：opt

form表单：frm frame框架：fra hidden表单项：hdn div标记：div

span标记：span 对话框对象：dlg 窗口对象：win

函数以及子过程命名规范

函数命名必须使用动词＋名词对的方式，并且能够体现函数的功能

函数命名的动词前缀必须是同函数功能相关的完整动词

函数命名第一个单词的首字母小写，后面每一个单词的首字母大写

下面让我们来看看腾讯公司推出的这款山寨版游戏截图，僵尸迷们看完后恐怕将彻底“内牛满面”。

正版《植物大战僵尸》截图

山寨版截图

2010年7月，《计算机世界》刊登了一篇题为《“狗日的”腾讯》封面头条文章，文中把腾讯作为互联网公敌进行批判，将互联网商业竞争写成了不 可调和的恩怨。详细叙述了联众、奇虎360等与腾讯之间的恩怨情仇。该文言辞辛辣、“刀刀见血”，并伴有联众创始人鲍岳桥等“受害者”声泪俱下的哭诉。 《计算机世界》更采用了一只身中多刀的腾讯企鹅作为其封面，称“山寨”的腾讯一直在模仿。

它的规则是这样的，竞拍需要拍点，每拍一次使用一个拍点，每个拍点2块钱。每个商品都是从零元起拍的，对于那些比较贵的商品，每次加价幅度一分钱，那些比较便宜的商品每次加价幅度6分钱。

看似能用很便宜的价钱买到商品，仔细算算，这部分成本其实转嫁到了其他人的身上。

拿今天下午4点还是竞拍的任天堂 iQue DSi （带摄像头）来说，网站标明原价1369元，最后拍得的人价钱是9.08元，每次加价幅度1分，就是说总竞价次数是908次，908*2=1816元，拍得的玩家竞拍次数348次，他共花了348*2=696元，他买折扣约是50%，网站赚了1816-1369=447元。

那没拍到的人的钱就算白扔了吗？不是的，没有拍到想要的商品，可以以差价换购，刚刚的拍点折合成人民币，你再补上差价就可以得到商品，理论上，你使用的拍点是不会浪费掉的。

在大家都在拍DSi拍得如火如荼的时候，我发现一个键盘没有人理，顺手点了一下，以0.42元的价格拍得……运费30元……也算有了收获。

为了让移动设备也能用上jQuery，jQuery开发团队发布了jQuery移动设备版开发项目jQuery Mobile Project（http://jquerymobile.com）。jQuery Mobile不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整统一的jQuery移动UI框架。

对于大名鼎鼎的jQuery开发团队来说，当然要让jQuery Mobile支持全球主流的移动平台，而不仅仅是北美流行的移动平台。想要知道jQuery Mobile项目将要做些什么吗？请看jQuery移动平台策略；想要知道jQuery Mobile项目将会支持哪些浏览器吗？请看Mobile Graded Browser Support。

jQuery Mobile开发团队正在紧张工作，准备那些要支持的移动设备并针对这些设备进行测试。他们争取在今年晚些时候发布jQuery Mobile。如果你想为jQuery Mobile提供帮助，请加入jQuery Mobile社区的讨论组。

jQuery Mobile项目已经得到了Palm, Mozilla等移动浏览器厂商的赞助。

jQuery Mobile开发团队说：“能开发这个项目，我们非常兴奋。移动Web太需要一个跨浏览器的框架，让开发人员开发出真正的移动Web网站。我们将尽全力去满足这样的需求。”

关于URL的一些准则

首先是与URL有关的一些准则。

一个URL必须唯一地，永久地代表一个在线对象

URL的最基本的使命是唯一地代表Internet上的一个对象，URL必须和Internet上的对象一对一匹配。然而现实中，这很难实现，我们经常可以通过多个URL到达同一个页面，比如，http://mysite.com/product/tv 和http://mysite.com/product?name=tv，这种情形在现代CMS中更是比比皆是，针对这个问题，SEO moz有一篇很好的文章，讲到了如何使用Canonical URL机制解决站点中的重复URL问题。

URL应该是永久的，这就要求你在站点上线前就非常严谨地规划URL。如果有一天，你不得不更改URL，一定使用HTTP 301机制，告诉浏览器和搜索引擎，你的那个URL 所代表的对象，已经搬迁到新地址，这个机制可以保证你旧地址所获得PR不会被清零。

尽可能用户友好

这是URL设计的根本，你的URL应该为最终用户而设计。保持URL友好的一个好办法是在保证可读性的同时让它尽可能短。比如/about 就好过/about-acme-corp-page，当然，保持简短不能牺牲可读性，/13d2一类的地址短则短矣，但并不友好。如果要在Twitter，Facebook一类的社会媒体网络分享你的URL，可以使用Bit.ly一类的网址缩短工具，但这种工具产生的缩短URL 并不友好，在WordPress一类的CMS 中，可以使用PrettyLink Pro或Short URL plugin一类的可控制的地址缩短插件。

URL 的设计切忌使用一些对用户来说没有意义的内容，比如数据库的 ID 号，/products/23这样的URL地址对用户是极不友好的，应当使用/products/ballpoint-pen一类的地址。

保持一致性

站点内的所有URL必须保持一致的格式和结构，这样可以为用户带来信任感，如果你必须更改URL格式和结构，需要使用HTTP 301机制。

可预测的URL

这也是URL一致性的一个表现，如果你的URL拥有很好的一致性，用户可以根据URL猜测别的内容的URL，假如/events/2010/01指向2010年1月份的日程内容，那
/events/2009/01应当指向2009年1月的日程。
/events/2010应当指向2010年全年的日程。
/events/2010/01/21应当指向2010年1月21日的日程。

URL中的关键词

URL中应该包含本页重点内容的关键词，比如/posts/2010/07/02/trip-best-buy-memory-cards一类的URL本身就是对页面内容的反应。在URL包含重点内容关键词，也可以提高SEO性能。SEO的一个很重要的原则就是，在URL地址中包含内容关键词。

关于URL的技术细节

下面说的是有关URL 的一些技术细节。

URL不应包含.html,aspx,cfm一类的后缀

这类信息对最终用户是没有意义的，却占了额外的空间，一个例外是.atom,.rss,.json 一类的特殊地址，这类地址是有特别的意义的。译者注：在某些虚拟主机式Web 服务器，这种做法未必现实。

URL不应包含WWW部分

WWW 部分并不包含任何意义，是一个额外的负担，不友好。可以使用HTTP 301机制，将www.domain.com 定向到domain.com 。

URL的格式

URL 的格式如下:

domain.com/[key information]/[name]/?[modifiers]

Key information部分一般代表信息的类型或类别。Modifiers部分则属于查询字符串范畴，它不应当代表数据结构，应当代表数据的修饰。Key information部分应当尽可能简短，同时应当表现出一种层级关系，比如http://domain.com/posts/servers/nginx-ubuntu-10.04，或 http://domain.com/news/tech/2007/11/05/google-announces-android。

Google News对新闻源有一个有趣的要求，Google要求新闻源页面的URL 中必须包含至少3位唯一的数字，因为他们会忽略年份数字，因此，应该使用一个5位或5位以上的数字。另外，也应该提供Google News 站点地图。如果你想向 Google 提供新闻，必须按这样的结构提供URL，当然保持一致性，可以预测性也是必需的。

使用小写字符

URL中所有字符都应使用小写，这更容易阅读。

URL中包含的行为元素

URL查询字符串中可能包含一些表示行为的元素，比如 show, delete, edit 等。非破坏性的行为可以体现在URL中，破坏性的行为应该使用POST 。

使用URL友好字符

在URL中体现网页标题的时候，往往会用到一些特殊字符，应当把它们转换为URL友好字符：
全部大写字符换成小写
诸如é一类的字符应转换成对应的e
空格使用短划线代替
诸如!,@,#,$,%,^,&,*一类的字符应该使用短划线代替
双短划线应该使用单短划线代替
另外，没有必要的话，避免使用%20一类的URL逃逸符。

更多观点

Chris Shiflett建议，可以使用一些类似句子的URL，如：chriscoyier.net/authored/digging-into-wordpress/
chriscoyier.net/has-worked-for/chatman-design/
chriscoyier.net/likes/trailer-park-boys
jacobwg.com/thinks/this-post/is/basically-done

译者补充：URL 的长度上限

URL的最大长度是多少？W3C的HTTP协议并没有限定，然而，在实际应用中，经过试验，不同浏览器和Web服务器有不同的约定：
IE 的URL长度上限是2083字节，其中纯路径部分不能超过2048字节。
Firefox浏览器的地址栏中超过65536 字符后就不再显示。
Safari 浏览器一致测试到80000字符还工作得好好的。
Opera 浏览器测试到190000字符的时候，还正常工作。

Web 服务器：
Apache Web服务器在接收到大约4000 字符长的URL时候产生413 Entity Too Large错误。
IIS 默认接收的最大URL是16384 字符。

打开doku.php

注意是PRC不是RPC，我就填错了，真丢人。

再看看时间，已经是显示正常了。

使用其实很简单，没什么配置的话装上就能用，这里着重解释一下它的几个访问模式。

1. Browser detection: 这个模式下不需要配置移动域名，插件会自动识别浏览器选择显示手机版网站或者桌面版网站。

2. Domain mapping: 这个模式下插件根据访问的域名来选择显示网站版本。需要配置一个移动域名。

3. BOTH: browser detection and domain mapping: 顾名思义，兼容以上两种模式。同样也需要配置移动域名。不同的是当用手机访问的时候会让你自己选择需要访问的版本。第二次访问的时候就会自动选择上次所访问的版本。

下面就是怎么配置移动域名：

按我的例子，主站是www.wangwenhao.net，移动域名是m.wangwenhao.net。

在空间的DNS配置里新建一个子域名m，将它定向到和www.wangwenhao.net相同的目录下就可以了，关于这个我纠结了很久，网上的资料也很少，尝试了很多次才成功的……