淡淡的渐变，

hover 上去有点淡淡的阴影，效果很好，对于不支持的浏览

 

器，设置一个颜色近似的背景，看到的是单色、直角效 果。
需要注意的是：代码实现的只能是线性渐变，从某个颜色均匀的渐变到另
外一个颜色，所以高光什么的只能舍弃了。

css3 中还有

径向渐变

，不过暂

时应用场景不多。
互联网发展速度很快，大大小小的新技术很多，多和前端交流吧。
关于对齐
主要是表单中文字的上下居中对齐，在

ps 里很简单，但是实现出来却如

上图所示的，很难看，要想对齐，真是件麻烦的事情，没有好的办法。所
以不是特别关键的地方，建议就随它去了。
二、前端是如何切图的

 

第一步 拼图

为了加快页面加载速度，会把多张图片拼在一张图片上。

 

第二步 保存为

Web 所用格式

网页上的图片，照片、

banner 类一般保存为 jpg，其他的，通常都是保存

为

png-8 或 gif（除了动态图片需要用到 gif，其他场景 png-8 完全可以

替代

gif）。对于保存为 png-8 或者 gif 的图片，有时候会看到图片呈现带

状感（如下图右侧），失真很严重。

有两个办法，一是增加颜色的数量，但是增加数量会导致图片变大，需要
在颜色数量和图片大小之间取一个平衡，而且如果图片上颜色太多，就算
颜色数量增到最大

256，依旧会有明显的带状感，这时候可以把图片拆开，

把颜色类似的图片拼在一张图上。
三、页面布局相关

元素叠加的效果
通过外补丁

(margin)、绝对定位(position:absolute)可以实现多个元素互

相叠加的效果，使得设计上不受布局的局限。
固定屏幕的效果

“

”

某些特殊场景使用（如上图的 回顶部 ），解决跟随的问题。
了解前端知识，不仅在沟通上更顺畅

,设计上更合理，对于设计过程也有

一定的帮助，比如在设计控件的时候，

ps 里看 hover 样式始终不够直观，

 

这时 可以把控件实现出来，直观的去感受，调整你的设计稿直到满意为
止。虽然成本比较大，但是对于需要仔细推敲的控件来说还是值得的。
某人曾说过，好的技术能带来设计上的突破，而好的设计也能促进前端技
术的发展。

css3、无极加载、在线编辑头像，很多技术的出现改变了设计的

方式，向后多走一步吧！