Web开发第三方工具使用案例

IconFont 阿里图标库

使用图标可以可以为页面增色，用字体图标替代图形图标可以简化开发，避免图片与文字的对齐问题，提高用户体验。IconFont资源丰富，品质较高，支持通过font-class，Systrm等方式使用图标，且提供了项目管理功能，创建项目后，挑选图标并加入项目，即可生成不同调用方式的CDN静态资源。

/*
代码片段：在项目中用使用Symbol引用IconFont图标表示会员等级(已简化) 
使用Symbol引用方式是因为其使用方便且支持多色图标
详见http://www.iconfont.cn/plus/help/detail?helptype=code
*/
//引入由IconFont生成的通过Symbol引用使用图标所需的的js(CDN地址)

//加入通用css代码（引入一次就行）

//调用函数获取用户会员等级图标，并显示
".tt_get_member_icon($this->_userId)."
//函数部分 返回用户等级图标
function tt_get_member_icon($user_id)
{
    $member = new Member($user_id);
/*
通过symbol引用IconFont图标
class属性对应上方定义的通用css中的类名
xlink:href属性对应IconFont的图标类名
*/
    if ($member->is_vip_type_3()) {
        return "";
    }
    else if ($member->is_vip_type_2()) {
        return "";
    }
    else if ($member->is_vip_type_1()) {
        return "";
    }

    return "";
}

效果图

IconFont **我的项目**

Staticfile CDN

由七牛云提供支持的静态资源库，收录的常用的js,css等静态资源库，在项目中使用可以简化开发(尤其是在库依赖较多时)，并有加快页面加载速度的作用。

/*
代码片段：  通过Staticfile CDN为项目引入vedio.js
若不使用静态资源库，则需要下载完整的js，css，兼容各浏览器内核的字体文件等
*/

Restlet Client -DHC

Chrome浏览器插件，可以方便的对http接口进行测试，在进行Ajax，Restful开发时非常有帮助。
//若无法翻墙，请自行搜索下载。

项目使用实图

Flat UI Colors

网站配色在很大程度上影响了网站的美观，Flat UI Colors列出了了扁平化设计中最受欢迎的色彩，可以吸取复制任何你看中的色彩。

网站截图

---

待续