读完本文，你就可以自己动手开发一个Chrome扩展应用啦 :-)

一、前言

Chrome提供了扩展（Extension）功能，可以看作是一个Web APP以插件的形式集成在浏览器中。

本文要示例开发的是一个简单的[ 天气预报 ]扩展，能够提供六天天气预报(包括昨天)，显示天气、温度、风速及当天空气质量等信息。

完成结果如图：

继续阅读→

在网页开发中使用字体是一个非常重要的部分，它与视觉感受和用户体验直接相关，尤其是在当下移动化的互联网时代，对字体的使用越来越讲究。

一、不同设备的字体表现

以往做PC端页面时，一直喜欢用"Microsoft Yahei","微软雅黑"来作为默认font-family，毕竟是中文字体中比较好看的一种，但是到了移动端，字体的表现就没有那么的'乖巧'了——并不是真正的微软雅黑，而是使用手机默认字体。也就是说IOS和Android系统不支持微软雅黑这种字体，下面是两种手机系统对字体的支持情况：

ios 系统

• 默认西文字体：Helvetica Neue
• 默认中文字体：Heiti SC (黑体)
• 其它常用西文字体：Tahoma、Arial、Verdana、Georgia
• 不支持微软雅黑字体

android 系统

• 默认西文字体：Roboto
• 默认中文字体：Roboto
• 其它常用西文字体：Arial
• 不支持微软雅黑字体

这里有一个Demo，可以扫码查看不同设备的字体表现：

继续阅读→

好吧其实不算总结，只是偷懒地列个大纲：)

本项目从3月开始进行研发策划，到6月8日正式发布上线，用时两个多月。

继续阅读→

移动设备各种规格高清屏的出现，使得PC端常规的px适配方案变得捉襟见肘，在这种情况之下，有针对移动端独立的一套适配方案就显得非常地重要。

第一印象

重度依赖meta标签的viewport和html标签的font-size，配合使用dpr\rem\px。

一些概念

1、Retina

"Retina"是“视网膜”的意思，指将更多的像素点缩至同样大小的屏幕里，显示屏的分辨率极高，超越了肉眼分辨单点像素的极限。 Retina技术一开始由苹果公司应用在iPhone4上，由于该技术带来的细腻屏幕显示体验，其它智能手机厂商纷纷仿效，由此引发了一股从普通屏幕到高清屏幕升级的潮流。如今市面上大部分智能手机都搭载了高清显示屏。

2、物理像素(physical pixel)

物理像素也叫设备像素(device pixel)，指显示屏中最小的一个物理部件，是屏幕的实际像素。

继续阅读→

今天山客推荐一个小游戏，来试玩吧

>>点我启动游戏！<<

键盘[上下左右键]可以控制飞行器运动，[空格键]发射炸弹。

屏幕右下角是游戏控制面板，有更酷炫的飞行器供选择（要登陆）。

这个游戏来自Kiss Ass,导入到本页面很简单,给一个a标签绑定链接,点击时引入游戏的js文件即可:

<a id="button" 
    href="javascript:var%20KICKASSVERSION='2.0';
    var%20s%20=%20document.createElement('script');
    s.type='text/javascript';
    document.body.appendChild(s);
    s.src='//hi.kickassapp.com/kickass.js';
    void(0);">
点我启动游戏
</a>