最终效果

1.在photoshop中新建文件，宽度200、高度200px，白色背景，分辨率72px(web图片)注意这就是我们要制作的按钮的实际尺寸。按住Ctrl+R调出标尺，分别拖动4条参考线到画布的四周，如下图：

按住Ctrl+alt+c调出画布调整面板，分别把宽度、高度设为800px和500px。

你会得到如下所示效果(为了便于示范我设置背景色为灰色)

你可以看到，这样我们就得到了200px*200px按钮的准确位置，参考线后面也不需要移除。

2.我们准备一个简单的背景。我倾向于用亮灰色做渐变填充，颜色设置如下：

新建图层命名为“backlight”，使用大、小柔角画笔，大画笔绘制中上方的光影，小画笔用来绘制画布正中间偏上的光影，效果如下：

重设光影层的大小和位置如下图：

现在我们的按钮已经有了非常漂亮的背景

3.按快捷键U调出圆角矩形工具，圆角半径设为10px，沿着参考线绘制圆角矩形。

把该图层命名为“button bg”，并添加如下图层样式：

投影

渐变叠加

描边

目前的效果：