# 用PS制作网页,抛砖引玉! - Photoshop专区 - 雨滴社区 - Powered by Discuz!
 找回密码
 点击注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

查看: 3012|回复: 9

[原创教程] 用PS制作网页,抛砖引玉!

[复制链接]

该用户从未签到

发表于 2012-11-21 12:30:39 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有账号?点击注册

x
本帖最后由 symbian 于 2012-11-21 12:38 编辑

【工具】
          PS CS5以上    图片若干     Dw CS5以上(可不下载,后期微调用)
【我的操作系统】
         WIN7 64位 /PS CS6/DW CS6

@Windows娘 一年没来雨滴了,改版太大了!不知道发这个会不会被HX,不费话了,上教程!

先上效果图:单击雨滴Logo可进入雨滴论坛
xg.jpg


HTML文件下载 网页.zip (25.52 KB, 下载次数: 0)




过程:
1.打开PS,按CTRL+O快捷键选定一张图片打开

1

1

2.jpg


2.选择切片工具
3.jpg


3.在图片上画一个你要加链接的区域,这里以雨滴Banner简单介绍下,高手请勿吐槽!
0.jpg


4.选切片选择工具,在刚选择的区域右键单击进行编辑
4.jpg
  
5.jpg
  
7.jpg


5.完成后点文件-存储为Web所用格式
bc.png


6.注意选择,好多人就败在这步
8.jpg 9.jpg

6.点保存,返回桌面查看,(刚才选的保存在桌面,SO......)
10.jpg


7.双击打开1.html即可

PS.因做好的网站涉及个人信息,不好发出来,临时写的这个简单教程,
     诸多不足,希望大家可以指正批评!




6.jpg

评分

参与人数 1活跃值 +10 技术值 +1 收起 理由
Windows娘 + 10 + 1 好,给力,切片教程。

查看全部评分

回复

使用道具 举报

该用户从未签到

 楼主| 发表于 2012-11-21 13:03:21 | 显示全部楼层
多谢捧场!
回复

使用道具 举报

签到天数: 6 天

[LV.2]偶尔看看I

发表于 2012-11-21 13:21:44 | 显示全部楼层
受教受教。。
回复

使用道具 举报

签到天数: 69 天

[LV.6]常住居民II

发表于 2012-11-21 14:07:51 | 显示全部楼层
楼主好帖子   加油加油  
回复

使用道具 举报

签到天数: 90 天

[LV.6]常住居民II

发表于 2012-11-21 19:55:12 | 显示全部楼层
这个挺好用的 正在做静态网站设计可以参考!
回复

使用道具 举报

签到天数: 117 天

[LV.6]常住居民II

发表于 2012-11-22 18:38:02 | 显示全部楼层
路过。顶下。
回复

使用道具 举报

该用户从未签到

 楼主| 发表于 2012-11-24 00:57:31 | 显示全部楼层
回复

使用道具 举报

签到天数: 9 天

[LV.3]偶尔看看II

发表于 2012-11-24 08:35:02 | 显示全部楼层

评分

参与人数 1活跃值 -3 收起 理由
王小彬 -3 恶意灌水,请节约水资源

查看全部评分

回复

使用道具 举报

签到天数: 67 天

[LV.6]常住居民II

发表于 2013-5-11 10:58:20 | 显示全部楼层
好帖子就支持!!
回复

使用道具 举报

签到天数: 47 天

[LV.5]常住居民I

发表于 2013-5-13 10:54:58 | 显示全部楼层
好东西就要学习啊
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 点击注册

本版积分规则

快速回复 返回顶部 返回列表