巧克力工厂

背景：台湾地震导致中美之间的海底光缆被震断。(Source)

我订阅的所有 Blog 都在说这件事的影响，我自己还好，看国内的网站基本没有影响，就是大概因为 FEED 烧录用的是 Feedburner，而 Feedburner 又在美国，加上我的主机也在美国，因此国内的朋友大概在光缆修好之前是看不着我的 Blog 了。

其实无数的 Blogger 已经把断光缆翻来覆去讲了好多，我再说也只能显得啰嗦。只是有一件事我非常不明白，所有的中美光缆线路都从台湾经过吗？台湾地震的影响让整个大陆无法访问美国，让我怎么觉得那么别扭呢……该不是政府在背后搞的鬼，想看看国内人民对这种事件的反应吧？或是是冤家整我们？当然这是我在瞎猜了。不过不是我有大国情节，从这么点小事让我觉得中国还是挺脆弱的，还需要努力改善这点，比如让自己对这种紧急情况有一套管用的第二方案什么的，而不是像现在这样束手无策的，据说要修好要十几天到一个月不等？

我又突然想到，如果想让 Blog 最大程序上被访问到，就得把主机和 Feed 烧录服务中起码其中一个放在欧洲。中美之间的线路常断之，而中欧之间的线路却从未听说大规模的故障。如果照此做的话，下次再断，就算不能访问 Blog，起码也能读读 FEED 吧，或是反之……

顺便说一下，明天去意大利旅游，为期 10 天。Blog 更新大概不能保证了，不过回来一定会制作一下意大利相片集滴，大家等俺胜利的消息吧！:-D

节日期间，在右上角加了个桑塔的的帽子，不知道大家有没有注意到？这个帽子的摆放还是让我花了一些工夫的，主要还是自己对 CSS 没有任何基础，知道 position 属性可以摆放对象对指定的位置，不过对其下的四个子属性 (static, absolute, relative, fixed) 理解不够。

Hoofei.com 上有个简短的解释，不过正因为有点太简短，我看了以后还是犯糊涂。放狗搜了一下，发现几篇文章比较好，苦苦研究后，终于开悟。

下面我做一个总结：

Static 属性：

1. Static 属性是每个元素的默认属性，也就是说，如果你没定义 position 的属性，那么 position 的属性就自动是 static。
2. 主要用来 override 其它三个属性。

Relative 属性：

1. 从目前的位置的偏移量。
2. 这个属性相对地移动元素，但并不把该元素拿出 page flow, 因此移动后，原占据的位置依然存在。换句话说，原位置会显示为空白。
3. Relative 属性可以控制其子容器的 Absolute 属性的显示。

Absolute 属性：

1. 用的最多的属性。
2. 不像 relative, 有 absolute 属性的元素不属于 page flow, 也就是说，相对于 relative, 它并不在页面上占据位置，可以在有效的范围内自由移动。
3. 重要：absolute 的移动范围是受限于最近的一个拥有 position 属性的母容器，但不包括 position 的属性是 static 的母容器。举个例子，如果：
   div-1 {position:relative; width:200px; height:200px}
div-2 {position:absolute; top:0; right:0}
   div-1 是 div-2 的母容器的情况下， div-2 就会出现在 div-1 内的右上角处而不是很多人认为的整个屏幕的右上角处。如果 div-1 中 position 是 fixed, div-2 出现的位置也是一样的。
4. 如果拥有 absolute 属性的元素的母容器中没有设定了 position 的，那该元素则自动属于“初始容器 (initial containing block)”，至于这个初始容器是怎么定义的，按 CSS 标准的说法是，完全取决于各个浏览器了。但一般来说，是指 Body 或是 HTML 元素。

Fixed 属性：

1. 该属性跟 absolute 的特点一样，除了…
2. 有该属性的元素会固定在指定的位置，不随着屏幕的滚动而滚动。如果你不理解 fixed 属性是怎么工作的，可以看看 voivo.de 的效果。
3. 重要：IE 不支持该属性。可以用 IE 和 Firefox 浏览 voivo.de 比较一下。

最后，使用 position 属性是还有几点要注意：

1. 如果你的 relative 属性的 width 为一个相对值（比如50%），IE 的 bug 会把宽度计算成该元素的母元素的宽度而不是该元素本身的宽度。
2. 如果你为 absolute 属性设定了一个 width，不管是相对 (e.g. 35%) 还是绝对 (e.g. 450px) 值，按照 CSS 标准，这时该元素的位置应该由最近的定义了 position 的容器决定（本文前面提到过），但 IE 和 Opera 都会错误地把该元素的位置直接交给了上一级的容器来决定。到目前为止，只有 Gecko 引擎的浏览器（比如说 Mozilla 的浏览器）才能按标准正确的解释。
3. 最好为 absolute 属性设定 margin, padding 的值，因为浏览器对 margin 和 padding 的解释各不相同，这样做可以保持网页的兼容性。

参考文章：
Relatively Absolute
Learn CSS Positioning in Ten Steps
The position declaration

还记得我以前写过我成了 Fonero 吗？

今天收到了 FON 给我的邮件，节日大赠送！

Invite a Friend to get a free La Fonera!

We want to celebrate this season by offering you the opportunity to give away our WiFi router La Fonera completely free to your friends.

In your User Zone you will find invitations that you can send to any friend that is not yet a Fonero. These invitations for a free La Fonera are redeemable in the FON Shop.

After your friends getting their free La Fonera make sure they register it and join the FON Community. You might find additional invitations in your User Zone so that you can continue giving them away.

如果有朋友需要路由器的，请留言告诉我。FON 的说法是：完全免费，你甚至不必支付邮费和人工费！！！需要注意的是，如果你想要一个 Linksys 的路由器，现在 FON 提供的已经不是 Linksys 的了，而是自主设计由台湾某厂代工生产的。可以到这里参看更多关于这个路由器的信息。

如信上说的，目前我有一个邀请机会。如果第一个被邀请的人使用了这个邀请，我就有机会邀请更多人了，所以，为了让更多朋友拿到免费的路由器，请确定你真的要使用这个邀请而不是拿去就忘在一边了。

由于 FON 支持的国家列表中没有中国大陆，只能跟国内的朋友说声抱歉了。这个邀请只能发给欧洲或是美国的朋友了。

有兴趣的朋友请留言说明，现在只有唯一的一个邀请，所以我会把邀请发给第一个留言的朋友。还有就是，请在留言中提供你所在的国家和你的联系 Email 地址（发送邀请需要），谢谢。

更新：邀请已发出，暂无新的邀请。

今天在 Google Operating System 上看到这篇文章时，一瞬间有那么一个感觉，感觉自己坐上时间机回到了过去，回首间刹那芳华。

八年前 Larry Page 在 google-friends 邮件列表上发出 Google 增加了搜索结果高亮显示和 Cache 功能的公告时，互联网对俺来说还是只听过没见过呢……当时的我跟当时的 Google 一样，年轻，鲜活，朴素。