本文主要内容是展示于讲解一种不错UI效果的实现，这个UI效果就是photoshop的选区效果。提供截图展示，提供原理动画演示，相信您会很快了解这类效果的实现方法的。另外，文章的后半部分列举了此效果的一些应用，希望能对开通您的思维提供帮助，利用这种UI效果实现更多精湛的web设计。
文章关键字 ‘图片’
使用CSS实现Photoshop选区效果及应用
2010年06月24日，星期四CSS渐变图片背景下高度亦自适应按钮
2010年06月21日，星期一
本文将介绍一种效果精湛，兼容性强，扩展性强，易上手易理解的按钮实现方案，此按钮与以往介绍的按钮一样，也是高宽自适应，可与图片混排，受控于text-align属性。但是这里的代码更加精简易懂，更符合主流与开发者的习惯。
本文提供必要的截图，提供Demo页面，以及代码展示，并对代码做了一定的讲解，希望能对您的学习有所帮助。
图片旋转+剪裁js插件(兼容各浏览器)
2010年05月6日，星期四在现在的web应用中，对上传的图片，例如头像，原始的摄影照片常常需要在web页面上进行一些处理，常见的处理就是剪裁与旋转。但是，似乎就目前而言，缺少即支持剪裁又支持旋转且轻量级的js插件。于是，我就抽时间写了个简单的插件。
兼容各个浏览器，使用canvas元素实现旋转，封装良好，希望能对您有所帮助。
纯js无图片无外链CSS图片幻灯片播放插件
2010年05月5日，星期三
本文展示我自己写的极轻量级的图片幻灯片播放的插件js，无外链图片，无外链CSS，兼容性性效果俱佳，无需调用外部的库，可谓大图幻灯片播放之首选。
本文提供demo，源文件下载，以及使用示例，希望能对您有所帮助。
CSS “渐进增强”在web制作中常见应用举例
2010年04月29日，星期四
“渐进增强”是对”Progressive Enhancement”一词的译文，我觉得翻译的很是得体。所谓“渐进增强”，有点农村包围城市的味道。打个不太恰当的比方，就是要先解决广大劳苦大众的温饱问题（即“渐进”），再这个基础上尽量的往小康方向发展（谓“增强”），至于是否要所有的人都过着小康水平，则不强求，当然越多小康家庭越好，没有也无妨，反正温饱不成问题，至少不会饿死。
就目前而言，虽对“渐进增强”有所了解的人挺多，但是要说普及与深入人生还远远不到火候。再举个不恰当的比方，现在就页面重构而言，占据主流的还是 “大锅饭”思想，即人人平等，人人相等，也就是以各个浏览器下表现一致为准则。这本身没有什么问题，大家都有饭吃，但是，显而易见，这会让领先的浏览器（Firefox、chrome等）优势无法显现出来。
CSS的“渐进增强”有别于CSS hack，hack可以说是提供选择，你死我亡，竞争效应；而“渐进增强”属于更进一步，锦上添花，辅助效应。前者应尽量避免使用，而后者适当使用则有裨益……
本文将非常详细的展示“渐进增强”在web站点上的一些常见应用，提供丰富的截图示例，希望能对您的学习有所帮助。
jQuery Lightbox(balupton版)图片展示插件讲解
2010年01月17日，星期日
jQuery Lightbox(balupton版)图片展示插件可以说是最优秀的lightbox效果的图片上一个下一个图片切换显示插件，没有之一。我将其原项目进行了翻译，自己进行了一系列的测试，并对原js文件一些英文内容替换成了中文，修改部分CSS文件代码使更符合中文的显示。
本文提供此插件详尽的概述，提供源文件下载，配合demo页面，相信一定会对您对这款插件的掌握有所帮助的。
CSS3 animate实现图片墙3D翻转效果
2010年01月12日，星期二本文主要就是展示了一个用纯CSS实现的图片墙动画3D翻转效果，有图片演示，有视频演示，有demo页面，提供简单的代码分析和原理讲解。目前而言仅chrome浏览器和Safari浏览器下有效果，所以，本文主要在于展示CSS3的一些特性以及潜能。希望对有兴趣的朋友有所帮助。
像素的世界及其在web开发制作中的应用
2009年12月7日，星期一
什么是像素的世界？如果您现在正在电脑前看这篇文章，那么您现在看到的就是像素的世界。本文的中心思想就是传达我们眼前所见都是由像素构成的这个意识。为了是让我们多一种思维的角度，对于我们web设计与开发有所帮助。内容多是个人的观点，可能会有不正确之处，欢迎指正，欢迎交流。提供必要的demo页面，配合丰富的插图，希望对您的学习有所帮助。
CSS实现圆角六色渐变自适应按钮详解
2009年11月21日，星期六本文将要展示如何用纯css实现2个像素的真正意义上的圆角，并且按钮带有细腻圆滑的渐变效果，其色彩丰富，可支持6种过渡色，从上往下可支配的颜色达9种。
本文将通过业余的图片、视频来演示实现的原理，将代码形象化，提供demo，希望您可以充分了解这种技术，也希望能开阔您的思维，对您的工作与学习有所帮助。
告别图片—使用字符实现兼容性的圆角尖角效果beta版
2009年11月6日，星期五字符既是文字又是图片，所以很多时候我们可以使用字符代替图片实现一些貌似只有图片才能实现的效果，例如，圆角，尖角等。您就可以使用字符实现这类效果。可以优化页面，提高性能。
本文以Google gmail邮箱中字符应用为引子，讨论的字符的一些特性，与图片相比的一些优缺点。而后，以字符+css的方式展示如果使用字符实现圆角效果，如何实现尖角效果。最后拿新浪微博的对话框做实际的实例，演示如何使用字符代替图片，实现几乎同样效果的优化，以展示字符的实际应用性及潜力。
本文提供详尽细致的demo页面，提供源文件打包下载，希望本文的论述能够对您有所帮助。
我的应用
我的应用