0

0

Photoshop打造超酷的设计类网页横幅

PHP中文网

PHP中文网

发布时间:2016-06-01 14:34:37

|

1662人浏览过

|

来源于php中文网

原创

设计类网页最重要是创意,画面要有一定的新意和视觉冲击力。因此在选择素材的时候多选一些艺术感较强的图片,然后发挥想象去渲染,做出自己满意的效果。

 最终效果

Photoshop打造超酷的设计类网页横幅

1、新建一个895×307px的图层,分辨率为300,背景颜色为白色,颜色模式为RGB。

Photoshop打造超酷的设计类网页横幅

2、打开人物素材,拖到刚刚新建的图层上面。

Photoshop打造超酷的设计类网页横幅


Photoshop打造超酷的设计类网页横幅
 
3、新建图层,使用钢笔工具圈出图片上半部分,需要带点弧度,然后使用快捷键ctrl+enter 使其进入选区。

Photoshop打造超酷的设计类网页横幅

Photoshop打造超酷的设计类网页横幅

4、选择渐变工具,设置渐变的颜色,并用吸管工具调整渐变颜色,颜色分别为:#a4dce7、#f8f7cf、#ea93d4。

Photoshop打造超酷的设计类网页横幅
 
5、点击渐变菜单上面部分的色标,设置不透明度。

Photoshop打造超酷的设计类网页横幅

6、然后选择线性渐变,拉个渐变出来,如果颜色太浓,可以使用橡皮擦工具稍微擦拭。

Photoshop打造超酷的设计类网页横幅

7、使用同样的方法,将图片下部分也做上渐变。

Photoshop打造超酷的设计类网页横幅

8、新建图层,选择椭圆选框工具,在图片上画个圆。

Photoshop打造超酷的设计类网页横幅
 
9、设置羽化40XP,填充白色(灰色也可)。

Photoshop打造超酷的设计类网页横幅

10、选择矩形选框工具,在刚刚那个羽化的圆圈中间拉个矩形。

Photoshop打造超酷的设计类网页横幅

11、拉好选区之后,按一下键盘上的Delete键,删除多余部分。

Photoshop打造超酷的设计类网页横幅

12、选择PS上部工具栏中的:编辑-变换-选择,将图层旋转到下图的位置。

Photoshop打造超酷的设计类网页横幅
 
13、使用QQ截图,将PS的工具栏截图下来,用PS打开。使用编辑-变换-变形,将其变形为下图的样子。

Photoshop打造超酷的设计类网页横幅

14、复制变形完的图层,选择:滤镜-模糊-动感模糊,设置角度为8,距离为30。

Photoshop打造超酷的设计类网页横幅

15、将上面用动感模糊处理过的图层拖到前面变形工具栏图层下方。

Photoshop打造超酷的设计类网页横幅

16、使用同样的方法,作出另外一个工具栏。

Photoshop打造超酷的设计类网页横幅

17、使用丝带的笔刷画几个丝带,设置一下颜色渐变(使用丝带素材也可)。

Photoshop打造超酷的设计类网页横幅
 
18、对丝带也进行刚才的模糊步骤。

Photoshop打造超酷的设计类网页横幅

19、新建图层,使用矩形选框工具在图片上拉一个矩形。填充#ffa800,设置透明度为60%。

Photoshop打造超酷的设计类网页横幅

20、在上面打上字。

Photoshop打造超酷的设计类网页横幅
 
21、把刚刚打的字栅格化,与黄色的图层合并。使用魔术棒工具,在X前面、N后面点一下,再按一下Delete。

Photoshop打造超酷的设计类网页横幅

Photoshop打造超酷的设计类网页横幅

22、使用同样的方法,制作其它文字。

Photoshop打造超酷的设计类网页横幅

23、最后,加上一些高光和装饰品,在图片的右上角,加上您的版权(不加也可)这次的炫酷标题栏就OK了。

Photoshop打造超酷的设计类网页横幅

大同搜索
大同搜索

多语言高质量的AI搜索

下载

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
Python 序列化
Python 序列化

本专题整合了python序列化、反序列化相关内容,阅读专题下面的文章了解更多详细内容。

12

2026.02.02

AO3官网入口与中文阅读设置 AO3网页版使用与访问
AO3官网入口与中文阅读设置 AO3网页版使用与访问

本专题围绕 Archive of Our Own(AO3)官网入口展开,系统整理 AO3 最新可用官网地址、网页版访问方式、正确打开链接的方法,并详细讲解 AO3 中文界面设置、阅读语言切换及基础使用流程,帮助用户稳定访问 AO3 官网,高效完成中文阅读与作品浏览。

200

2026.02.02

主流快递单号查询入口 实时物流进度一站式追踪专题
主流快递单号查询入口 实时物流进度一站式追踪专题

本专题聚合极兔快递、京东快递、中通快递、圆通快递、韵达快递等主流物流平台的单号查询与运单追踪内容,重点解决单号查询、手机号查物流、官网入口直达、包裹进度实时追踪等高频问题,帮助用户快速获取最新物流状态,提升查件效率与使用体验。

98

2026.02.02

Golang WebAssembly(WASM)开发入门
Golang WebAssembly(WASM)开发入门

本专题系统讲解 Golang 在 WebAssembly(WASM)开发中的实践方法,涵盖 WASM 基础原理、Go 编译到 WASM 的流程、与 JavaScript 的交互方式、性能与体积优化,以及典型应用场景(如前端计算、跨平台模块)。帮助开发者掌握 Go 在新一代 Web 技术栈中的应用能力。

15

2026.02.02

PHP Swoole 高性能服务开发
PHP Swoole 高性能服务开发

本专题聚焦 PHP Swoole 扩展在高性能服务端开发中的应用,系统讲解协程模型、异步IO、TCP/HTTP/WebSocket服务器、进程与任务管理、常驻内存架构设计。通过实战案例,帮助开发者掌握 使用 PHP 构建高并发、低延迟服务端应用的工程化能力。

16

2026.02.02

Java JNI 与本地代码交互实战
Java JNI 与本地代码交互实战

本专题系统讲解 Java 通过 JNI 调用 C/C++ 本地代码的核心机制,涵盖 JNI 基本原理、数据类型映射、内存管理、异常处理、性能优化策略以及典型应用场景(如高性能计算、底层库封装)。通过实战示例,帮助开发者掌握 Java 与本地代码混合开发的完整流程。

9

2026.02.02

go语言 注释编码
go语言 注释编码

本专题整合了go语言注释、注释规范等等内容,阅读专题下面的文章了解更多详细内容。

62

2026.01.31

go语言 math包
go语言 math包

本专题整合了go语言math包相关内容,阅读专题下面的文章了解更多详细内容。

56

2026.01.31

go语言输入函数
go语言输入函数

本专题整合了go语言输入相关教程内容,阅读专题下面的文章了解更多详细内容。

28

2026.01.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
CSS3 教程
CSS3 教程

共18课时 | 5.1万人学习

Git 教程
Git 教程

共21课时 | 3.3万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.2万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号