设为首页
收藏本站
现距离劳动节还有:
天气与日历
开启辅助访问
切换到窄版
登录
立即注册
门户
Portal
论坛
BBS
在线影视
免费小说
FC游戏
app下载
插件
Plugin
搜索
搜索
每日签到
本版
文章
帖子
群组
社区
»
论坛
›
软件源码
›
教程分享
›
Photoshop制作一款黑色的网页菜单
返回列表
发新帖
[
ps
]
Photoshop制作一款黑色的网页菜单
[复制链接]
87
|
4
|
2023-3-10 04:40:09
|
显示全部楼层
|
阅读模式
[
导读
]在这个教程里你将会学到如何创建一类似于这个网站所使用的内容区。其中带有圆角和3D标题效果。如果你对于此教程有任何疑问。
在这个教程里你将会学到如何创建一类似于这个网站所使用的内容区。其中带有圆角和3D标题效果。如果你对于此教程有任何疑问。
这是最终的效果:
13124Ab923G0-1H502.jpg
(15.3 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124Ab923G0-1H502.jpg
1、我们要做的第一件事情就是创建一新的文档。在这个教程中我们使用400×400像素的文档大小。
13124Ac0UH0-1W559.jpg
(31.67 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124Ac0UH0-1W559.jpg
2、将背景色更改为#000000。
3、接下来使用圆角矩形工具画出如下的一选区,半径为10px。
13124Ac2JN0-192W5.jpg
(21.68 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124Ac2JN0-192W5.jpg
4、我们想让矩形更生动一些,因此在图层面板中的矩形图层上点击右键,选择混合模式,使用如下设置。
13124Ac403X0-2014L.jpg
(22.94 KB, 下载次数: 0, 售价: 3 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124Ac403X0-2014L.jpg
13124Ac5545Z-211T5.jpg
(27.69 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124Ac5545Z-211T5.jpg
[1]
回复
使用道具
举报
老师傅
|
2023-3-10 06:14:05
|
显示全部楼层
[
导读
]在这个教程里你将会学到如何创建一类似于这个网站所使用的内容区。其中带有圆角和3D标题效果。如果你对于此教程有任何疑问。
5、这时你应该得到如下图的效果:
13124AcITF-221I9.jpg
(21.57 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124AcITF-221I9.jpg
6、下一步我们要做的是使用矩形选区工具做出如下图的选区,将其填充为白色。
13124AcZ510-232c6.jpg
(23.93 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124AcZ510-232c6.jpg
7、很显然,我们并不需要白色,因此我们在图层上点击右键,应用如下设置
13124B00042360-24V18.jpg
(32.04 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B00042360-24V18.jpg
13124B0043AF-25C16.jpg
(28.25 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B0043AF-25C16.jpg
13124B0059E50-263313.jpg
(53.7 KB, 下载次数: 0, 售价: 2 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B0059E50-263313.jpg
[2]
回复
使用道具
举报
老师傅
|
2023-3-10 06:36:07
|
显示全部楼层
[
导读
]在这个教程里你将会学到如何创建一类似于这个网站所使用的内容区。其中带有圆角和3D标题效果。如果你对于此教程有任何疑问。
8、你应该得到和下图类似的效果:
13124B00X340-2J122.jpg
(24.15 KB, 下载次数: 0, 售价: 2 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B00X340-2J122.jpg
9、下一部分我们要做标题的折叠效果。这样就有了透视的feel。使用多边形套索工具创建一如下的选区,将其填充为白色。
13124B02002T0-2X149.jpg
(10.64 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B02002T0-2X149.jpg
10、然后我们给这个图层应用如下图层样式:
13124B024063P-291396.jpg
(28.48 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B024063P-291396.jpg
13124B025610-3093a.jpg
(54.6 KB, 下载次数: 0, 售价: 6 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B025610-3093a.jpg
[3]
回复
使用道具
举报
老师傅
|
2023-3-10 07:40:23
|
显示全部楼层
[
导读
]在这个教程里你将会学到如何创建一类似于这个网站所使用的内容区。其中带有圆角和3D标题效果。如果你对于此教程有任何疑问。
11、然后给另外一边重复上面的步骤,你会得到如下的结果:
13124B02I4540-319634.jpg
(23.17 KB, 下载次数: 0, 售价: 2 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B02I4540-319634.jpg
12、下一步我们要做的是给内容区添加标题,选择文字工具添加标题文字。
13124B02Y0320-321M6.jpg
(10.42 KB, 下载次数: 0, 售价: 1 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B02Y0320-321M6.jpg
13、白色有些过于平淡,所以我们给文字也添加图层样式。
13124B033100Z-331253.jpg
(27.75 KB, 下载次数: 0, 售价: 3 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B033100Z-331253.jpg
13124B034M1F-345037.jpg
(52.61 KB, 下载次数: 0, 售价: 4 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B034M1F-345037.jpg
[4]
回复
使用道具
举报
老师傅
|
2023-3-10 09:17:47
|
显示全部楼层
[
导读
]在这个教程里你将会学到如何创建一类似于这个网站所使用的内容区。其中带有圆角和3D标题效果。如果你对于此教程有任何疑问。
14、你会得到类似于下面的效果。看上去好多了。
13124B03B5Y0-356364.jpg
(25.36 KB, 下载次数: 0, 售价: 2 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B03B5Y0-356364.jpg
15、还有一步要做,将文字图层复制一遍,关掉新图层的混合选项,文字颜色设置为#FFFFFF。将这个图层放置于原始图层的下方,使用方向键将其向下移动1个像素。
13124B03SJ60-362522.jpg
(6.18 KB, 下载次数: 0, 售价: 2 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B03SJ60-362522.jpg
16、这个效果太强烈了,我们要让它变得更温顺一些。我们将不透明度调整为28%左右,这样你会得到如下结果:
13124B0393X20-3J4X.jpg
(25.2 KB, 下载次数: 0, 售价: 4 金钱)
2023-3-10 04:40 上传
点击文件名下载附件
13124B0393X20-3J4X.jpg
17、这就是全部的步骤。你还可给内容区添加一小,然后添加一些链接完成整个设计。
[5]
回复
使用道具
举报
返回列表
发新帖
高级模式
B
Color
Image
Link
Quote
Code
Smilies
您需要登录后才可以回帖
登录
|
立即注册
本版积分规则
发表回复
回帖后跳转到最后一页
浏览过的版块
恐怖故事
攻略秘籍
老师傅
1963
主题
2786
回帖
1万
积分
版主
积分
11469
加好友
发消息
回复楼主
返回列表
软件分享
源码分享
教程分享