加入收藏 | 设为首页 | 会员中心 | 信息反馈 | RSS

栏目导航 | Photoshop | Fireworks | CorelDRAW | Freehand | Illustrator | 广告设计 |
☞ 您当前的位置:首页 > 学院 > 平面设计 > Photoshop 发表评论 加入收藏夹 错误报告

网站图标:透明背景favicon.ico图标的制作方法

时间:2012-07-16  来源:站长之家  作者:那年那事那人  点击:    打印本文打印本文  发表文章发表文章

☆欢迎浏览本站【Photoshop】栏目文章《网站图标:透明背景favicon.ico图标的制作方法》! 本文内容来源于[站长之家],作者[那年那事那人],转载请注明!希望本文能为您的学习、工作和生活提供有效的参考和帮助!

☞ 此外本栏目编辑还推荐您阅读: #&欢迎访问wWw.zGDoC.CoM - &中国#文秘资源网@ - 您身边@#免费@贴心$的文秘%专家 - 精彩演讲&心得体会#社交礼仪#导游词#入党申请#法律文书#毕业论文#知识百科#范文大全#考研#

LOGO

很多人说专业的网站一定需要favicon.ico图标,不过favicon.ico图标对于我来说只是为了好看,其实现的效果如下图(你可以看见在浏览器标签以及收藏夹中红色框标注的地方,网站标题前都会有一个与LOGO一样的小图标,这就是favicon.ico图标):

网站ico图标

不过,你现在看到的是背景透明的favicon.ico图标,这样不管浏览器的背景色如何改变,我们都能保证与主题色一致,但是如果按照常规的做法,在ico图标在线制作网站上进行直接转换,favicon.ico图标的背景色只会是白色,哪怕你用的源文件是背景透明的png或者gif格式都不行。

于是我折腾了很久终于找到制作透明背景favicon.ico图标的方法:

首先你要用PS做出格式为png或者gif背景透明的图标图片,大小为16×16、32×32都可以(单位是像素),命名为favicon;

然后你需要去下载一款名为“Axialis IconWorkshop”的图标制作工具,此款工具你可以自己搜索一下,网上很多绿色版;

用Axialis IconWorkshop打开已经做好的图标文件(我以png格式为例):

透明背景ico

点击如下图红色方框标注的按钮:

ico透明背景

这时你就会来到“从图像创建Windows图标”的窗口,将图标项目名命名为“favicon”,根据你的需求选择“32×32-RGBA”或者“16×16-RGBA”(就我看来32×32-RGBA会比较清楚),然后点击确定,如下图所示:

透明背景图标

最后点击选择菜单栏上的“文件”→“另存为”ico格式的图标即可,如下图:

背景透明ico图标

这时候你回到桌面会看见favicon.ico图标仍然有白色的背景,不用担心,这只是显示问题,实际上此时的favicon.ico图标已经是透明背景啦,你传到服务器里,再清除一下浏览器的缓存看看效果吧。(本人出自那年那事那人)

感谢 那年那事那人 的投稿

#&欢迎访问wWw.zGDoC.CoM - &中国#文秘资源网@ - 您身边@#免费@贴心$的文秘%专家 - 精彩演讲&心得体会#社交礼仪#导游词#入党申请#法律文书#毕业论文#知识百科#范文大全#考研#

来顶一下
近回首页
返回首页
 上一篇:Photoshop极品教程 模糊照片变清晰 下一篇:学PS基础:Photoshop+技能167个+经典的Photoshop技巧大全
评论列表共有 0 条评论
发表评论 共有 条评论
用 户 名:   密码:    匿名发表   还没有注册?
评论表情:
  验证码:
站内搜索
推荐阅读
2012年考研真题及答案解析专题
2012年考研真题及答案
2011年12月大学英语六级考试真题及答案解析汇总
2011年12月大学英语六
2011年12月大学英语四级考试真题及答案解析汇总
2011年12月大学英语四
2011年9月全国计算机等级考试真题以及答案汇总
2011年9月全国计算机等
相关文章
栏目更新
栏目热门
秘书在线