如果我们希望把一个网站的更新实时发布到令一个网站上，最好的方法是通过 RSS 进行转载。如果只是需要简单的对更新的条目做个提示的话，使用 JavaScript 是最可行的方法。但是通过 JavaScript 解析一个 XML 文档十分麻烦。幸好 Yahoo Pipes 为我们提供了非常好的 RSS to JSON 功能，我们可以先把 RSS 转换成 JSON 再用 JavaScript 进行解析，这样比直接解析 XML 简单得多！

把 RSS 转换成 JSON

首先登录 http://pipes.yahoo.com ，新建一个 Pipe ( Creat a Pipe ) 。然后在左边的工具里选择 Sources > Fetch Feed ，在输入框里输入一个 RSS 地址。再用线把 Fetch Feed 和 Pipe Output 两个框框连起来（如右图），保存这个 Pipe，然后点击顶部的 Run Pipe… 。点击 Publish 发布这个 Pipe ，然后记下 Get as JSON 的 URL。简单几步就已经把一个 RSS 转换成 JSON 了，而且这个 JSON 会根据 RSS 的更新自动更新。

在网页里使用圆角效果是使网页更加美观的一个简单而有效的方法，可是由于 IE 和一些老式浏览器的存在，如何使页面在各个浏览器里的效果一致一直困扰这网页设计人员。最近我在制作主题时面对一个艰难的抉择，因为我要在主题里使用大量的圆角，我应该如何去协调圆角在不同浏览器里的效果？下面我将列举一些产生圆角的方法，并阐述一下它们的优点和缺点，各位观众在以后遇到这种问题的时候可以根据自己的时间或者技术需要进行取舍。

CSS 圆角

关于 CSS 圆角在《再谈 CSS 圆角》一文里已经有详细的阐述。但纯 CSS 的圆角一些老式浏览器根本不支持。使用框架叠加的话不但会使页面结构变得非常复杂，而且大量的多余框架也会给一些后期开发带来困难。而使用圆角的图片作为背景则很难在一些灵活多变的页面里进行应用。因此 CSS 圆角目前只能在一些框架（主要是宽度）比较固定的页面里，通过图片的方式来实现。

阴影是最常用的 CSS 效果之一，CSS3 标准已经增加了阴影属性，下面讨论一下阴影在各种浏览器里的实现方法。

CSS3 阴影

CSS3 里使用 box-shadow 属性定义块的阴影，基本语法如下：

1

box-shadow: 3px 3px 4px #000;

上面的样式里，前面两个 “3px” 表示阴影在 xy 两个坐标轴上的偏移量，x轴的正方向向右，y轴正方向向下。这个坐标和我们平时用的有点出入。在 Firefox 和 Webkit 等浏览器里，为了达到最高效率，建议通过私有的 hack 实现 CSS 阴影，可以这样写：

因为大多数虚拟主机都有流量限制（特别是博客主机），因此很多人都选择把图片储存到 Flickr 和 Picasa 等免费相册里，再通过外链插入到文章里。但由于这些网站经常被 block ，因此我建议大家还是尽量把图片放到自己的服务器上。

由于我个人很懒，万一博客搬家的话，过多的文章附件将会给文件的迁移带来麻烦。因此我以 cosbeta 的 Pika 插件为蓝本写了一个远程图片代理程序，并对较多博客使用的 Picasa 、 Flickr 和 PhotoBucket 这三个图床服务进行了防止链接被重置的处理。请点这里下载脚本。

transform rotate 是CSS3里使对象旋转的一个属性，虽然目前所谓的兼容CSS3的浏览器对它的支持还不算好，但Firefox、Webkit和Opera这些浏览器都已经提供了官方的hack去支持这个属性。唯独在IE里，这个属性无法通过一般的CSS去实现。

在W3C官方的标准里，通过transform属性使对象旋转的写法如下：

1

transform: rotate(40deg); /* 其中40是旋转的角度 */

可是由于目前几乎所有的浏览器对这个属性的渲染效率都很低，所以我们可以用下面的hack去提高渲染效率：

CSS3里的 target 和 focus 伪类都是针对特定元素的选择器，可以用来突出元素的位置。

target 伪类

target 伪类用于改变锚链接URL所指向的ID的样式。例如你要让页面页面里任何通过锚链接访问的元素字体都变成红色，可以这样写 *:target { color : red }。

需要注意的是，在添加 target 样式之前你必须为该元素指定一个id。效果请看我的 DEMO。

CSS3提供了强大的伪类（pseudo-class）选择器，使开发者能选择某一对象中符合特定条件的元素进行渲染。这些伪类在刚接触的时候大家会觉得非常混乱，但当掌握了以后能大大提高你的代码效率，并且节省代码量。今天先要说的是nth-child伪类。

nth-child伪类的定义

nth-child伪类在W3C里定义是选择选择父元素里的第n个子元素，可以使用an+b的形式选择子元素，举例用法如下：

1
2
3
4

tr:nth-child(2n+1) /* 选择表格里的单数行 */
tr:nth-child(odd)  /* 同上 */
tr:nth-child(2n)   /* 选择表格里的双数行 */
tr:nth-child(even) /* 同上 */

聪明的看官大概已经知道nth-child伪类可以用来干什么了。

CSS Drop-Down Menu Framework是一个基于GNU General Public License开源的纯CSS下拉菜单框架，能在IE5+、Firefox1.5+、Safari2+、Chrome1+和Opera7+这些浏览器上运行，但在IE6和IE6之前的浏览器里是通过JavaScript辅助的。你可以修改它，以应用在你的网站。CSS Drop-Down Menu Framework完全符合XHTML1.1和CSS2标准，使用这个框架，创建一个与众不同的下拉菜单只需要十几分钟。目前有Flickr、nVidia和Adobe等大型网站的下拉菜单都使用了这个框架。

貌似最近网上对CSS3的讨论真的很火，现在讲一下CSS3里目前用的比较广的RGBA属性的高级使用方法。这个属性的兼容问题比较简单，IE8已经支持这个属性，IE6和IE7也可以通过hack支持。RGBA和CSS2里的RBG属性差不多，只是RGBA属性多了一个透明度的定义，CSS3标准里对RGBA属性的解释如下：

1
2
3
4
5

/* 基本语法 */
em { color: Rgba(red,green,blue,opacity) }
/* 举例 */
em { color: rgba(255,0,0,1) }    /* 红色，不透明 */
em { color: rgba(100%,0%,0%,1) } /* 同上 */

在现实中，使用三个1~255的十进制数值去定义一个颜色比用百分比更加准确，下面是几个颜色的RGB数值，大家在使用的时候只需要把00~FF的16进制数值换算成十进制就行了。

奶瓶腿（英文名： Netputweets，开源地址）是一个由 @NetPuter 修改、架设的一个安全的、个性的中文 Twitter 手机客户端，基于 Dabr 源码，在国内非常流行。但是直到目前的最新版（NetPutweets_2009_Final_SP2，发布于2010年1月3日）还没有支持时下最流行的img.ly推图服务。这也对一些喜欢贴图的用户造成了一定的不便，因为奶瓶腿默认的图片上传服务twitpic在国内已经不能访问了，现在写一下为奶瓶腿在上传图片时给用户提供图片服务选择和预览img.ly图片的方法。

1.提供图片服务选项

这个方法参考了《给dabr添加多种图片上传服务》，但选择太多有时反而是累赘，保留大众的就行，因此我精简了一下。

打开common/menu.php，在 function theme_menu_toptop 和 function theme_menu_bottomtom 都进行以下修改。