1、 首先根据实现图片的大小制作一个圆角边框。打开PS，新建一空白文档，文档的大小根据需要情况来定，在此小编将其设置为400*400,设置完成后点击”好“按钮。
2、 选择工具栏上的”矩形“工具，在属性面板中将其半径设置为”20像素“，然后在绘图区绘制一个圆角矩形。
3、在该图层的空白区域右击，选择”栅格化图层“，将该图层转换成普通图层。
4、在按住键盘上的CTRL键同时，点击”形状1“图层，将当前图层内容选中。然后点击工具鲥鲣剔墟栏中的”填充“工具，设置一种合适的前景色，点击图形区域进行填充。
5、双击该形状1”图层，在打开的“图层样式”对话框中勾选 “斜面和浮雕”效果，并设置合适的参数后，点击“确定”完成设置。
6、点击“文件”菜单中的“存储为Web所有格式”，在打开的窗口中将输出的图片格式设置为“PNG-24”，最后点击“存储”进行保存。
7、 打开Dreamweaver8，点击“文件”菜单，在打开的”新建文档“窗口中选择”基本页“→”HTML“，点击”创建“以新建一个网页文件。
8、点击”文件“→”另存为“，将该文件另存为”index.html"。
9、 然后在该文档的代码区输入如图所示的代码：
10、点击“文件”→“在浏览器中预览”，然后选项其中的一个浏览器进行预览，效果如图所示。
