网页常用按钮制作教程之一

2016-03-18 05:58 2 1 收藏

清醒时做事,糊涂时读书,大怒时睡觉,无聊时关注图老师为大家准备的精彩内容。下面为大家推荐网页常用按钮制作教程之一,无聊中的都看过来。

【 tulaoshi.com - PS 】

最终效果


素材


1.新建一个500*250象素的窗口,填充绿色(R:52,G:175,B:125),再新建一层命名为"按钮--底部",选择“圆角矩形工具”如图1,半径数值为“4”如图2,绘制如图3所示的圆角矩形。


图1


图2


图3
2.锁定图层,选择渐变工具,颜色设置如下图4,由上至下绘制渐变效果如图5


图4


图5

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)3.在"按钮--底部"上面新建一层命名为“按钮--高光”,调出“按钮--底部”的选区如图6,选择菜单:选择 修改 收缩,数值为1,再填充淡绿色(R:244,G:253,B:235),按Ctrl + D取消选区。


图6


图7


图8
4.如图9在“按钮--高光”这层添加蒙版,再用黑白渐变工具如图10由上往下绘制渐变,效果如图11


图9


图10


图11

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)5.回到“按钮--底部”这一层,调出图层样式,分别进行"描边"和"内发光",设置如图12,(www.tulaoshi.com)图13效果如图14


图12


图13


图14
6.在"图层--高光"上面打上“PS联盟”的文字如图15


图15

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)7.调出文字的图层样式添加阴影。具体设置如图16,效果如图17

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)
图16


图17
8.回到背景这层,把素材里面的花纹拖过来,把颜色改成绿色,放到按钮的底部做装饰。效果如图18 PSD下载


图18
9.根据需要适当的调整一下,可以做出不同风格,不同颜色的按钮。


图19

来源:https://www.tulaoshi.com/n/20160318/1873943.html

延伸阅读
标签: 服务器
LLsMP系列教程之一:Debian安装LLsMP环境教程 从今天开始老左分享LLsMp系列教程。作为LLsMP就是Linux + Litespeed + MySQL + PHP环境,大部分都是安装在debian系统中,所以我们在设置安装VPS的时候要先安装Debian系统,然后才可以进行下一步操作。 看到网上很多关于LNMP与LLsMP的相关对比,各有各的优势,具体我也没有做过对比,以...
标签: 服务器
LNMP系列教程之一:添加域名建立站点 昨天分享了Linux VPS CentOS安装LNMP系统环境教程,有些朋友说网上已经有过类似的教程,可能你再发布有些多余。我认为还是有必要的,一来是我自己学习使用,二来可以作为记录自己使用的时候笔记,以便下次使用的时候直接利用起来,同时别人的毕竟是别人的,自己还是需要梳理。就像我从现在开始,整理...
一指禅: 1.将铃扯起,快速来回运转。 2.稍稍发力使铃碗抛出。 3.用右手平稳接住铃碗上下绕圈。 4.再高高抛起铃碗,接住继续运铃。 5.动作完成。  
PS快速制作网页按钮 效果图如下: photoshop教程开始www.tulaoshi.com: 第1步: 分辨率1280 x 1024像素创建一个新项目 第2步: 现在选择圆角矩形工具(U)和半径300像素的形状像如下 第3步: 打开图层样式,选择渐变叠加,设置渐变叠加像如下 第4步: 现在选择圆角矩形工具(U)...
标签: PS PS基础
先看看效果图 打开photoshop,新建空白文档。 为了不让白色背景看起来乏味,增加一个渐变叠加效果。渐变颜色为# f3f3f3到# c6c6c6。 选择圆角矩形工具,创建按钮的的主要形状,半径为5 px。 添加渐变叠加图层样式。渐变颜色从#0d3079到#557bc9。 现在让按钮从背景中突显出来,添加1 px描边,颜色为深蓝色(#0b2258)。 ...

经验教程

918

收藏

26
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部