iconfont上传全黑技术上是怎么做的

Win7开始按钮图标怎么做,利用PS制作开始按钮图标图文教程
Win7开始按钮图标怎么做,利用PS制作开始按钮图标图文教程 看到网络上网友对自己电脑的截图,人家的Win7开始按钮图标实在是别致!羡慕嫉妒恨呐!一时兴起,自己也制作一个。很多朋友听说自己制作Win7开始按钮图标,一定说你别扯了!那就先来让您看看小编的Win7开
  Win7开始按钮图标怎么做,利用PS制作开始按钮图标图文教程 看到网络上网友对自己电脑的截图,人家的Win7开始按钮图标实在是别致!羡慕嫉妒恨呐!一时兴起,自己也制作一个。很多朋友听说自己制作Win7开始按钮图标,一定说你别扯了!那就先来让您看看小编的Win7开始按钮,如下图所示!想不想自己做一个,那就看下利用PS制作开始按钮图标图文教程的内容,看过之后您会感觉,原来Win7开始按钮图标怎么做的问题很简单!
  第一步、打开Photoshop CS6,新建一个宽54,高162的透明背景文件
  第二步、然后再打开一张自己中意的素材图片,使用魔棒工具,选择图标主体,不会选择全对不对,没关系,点击&选择&菜单,在下拉菜单中选择&选取相似&,多选几次,把不需要的部分剔除,再不行的话,按住Shift键,剔除不需要的部分。
  第三步、点击&图像&菜单,下拉菜单中选择&图像大小&,将图片调整到长宽均为32,然后在点击&选择&菜单,将图像&载入选区&
  第四步、点击&编辑&菜单,选择&拷贝&,然后转到图标文件界面,仍然选择&编辑&菜单,选择&粘贴&命令,这次不用调整位置,默认粘贴在在中间位置
  第五步、返回素材图片界面,使用&图像&菜单里面的&调整&次级菜单选择&亮度/对比度&,适当调整一下(调亮一点),然后重复第四步操作,按住Ctrl键,调整图像位置,接下来再次调整素材图片的亮度和对比度(调暗一点),同样粘贴到图标文件,最终效果如下
  第六步、现在可以保存图片了,点击&文件&菜单中选择&储存为&,将文件尽量先存为psd格式,方便以后调整,调整好之后存为png格式,交工!
  利用PS制作开始按钮图标图文教程的内容,对您解决Win7开始按钮图标怎么做的问题有所帮助么?
  扩展阅读:
(责任编辑:IT信息技术民工)
感谢朋友们光临北海亭IT信息技术个人网站,如果您感觉本站对您搜索的问题有所帮助,并感觉对本站还满意的话,希望您把本站分享给您的朋友!在此对您表示由衷的谢意!
------分隔线----------------------------教你快速打造优美的iOS应用图标
教你快速打造优美的iOS应用图标
开始前,请先准备一个 iOS应用图标模板,可以从 iOS Icon Template 或者 App Icon Template 下载(我用的就是后者的素材)。我的电脑屏幕上只显示了 1024px 的大图标,我觉得用这个模板做参考就可以了。你可以将应用图标模板进行裁剪,只保留 1024px 的图标,或者处理模板上的其余元素。下面我们正式开始。步骤1:创建iOS 应用图标的基本形状首先新建一个图层并填充背景色,参考色值是 #acced6。接下来,给颜色图层添加蒙版,使其呈现图标的轮廓。技术上来讲这一步可要可不要,因为上传图片之后,苹果官方会自动帮你切成圆角。不过,为了呈现更好的视觉效果,我建议使用蒙版。怎么操作呢?按住 COMMAND (MAC 用户)或者 CTRL (Windows 用户)键的同时点击图标模板图层,颜色图层就会出现一个选区啦。再在图层面板的底部点击蒙版图标,就可以创建蒙版了。步骤2 :添加渐变色在颜色图层点击鼠标右键,在弹出的菜单中选择混合选项。我们来给它加一个弱渐变。渐变的起始和终止色值分别为 #acced6 和 #7cbece。渐变样式选择线性渐变,角度设置为 135 度,呈现出由左上角的深蓝色到右下角的浅蓝色渐变效果。如果这两种颜色顺序搞颠倒了,调整角度为 -135 度或者 315 度就行了。步骤3:创建内圆图标中部的白色圆形是整个图标设计的重要组成部分,我们可以利用 iOS 图标栅格画一个圆:使用椭圆工具(U)创建一个宽高为 890px 的正圆,在属性面板中可以调整它的大小以便与栅格对齐。步骤4:给圆形添加图层样式给形状图层添加描边、阴影和渐变等图层样式。添加渐变圆的渐变比较简单,渐变色值为 #ffffff 和 #d9d9d9。渐变样式选择径向渐变。要让圆的中心呈现些许亮色,从圆心到边缘有一个白色到浅灰色的渐变,缩放比例设置为 150%。添加描边圆的描边要加粗,描边位置选择内部,描边大小的参考数值为 30px,填充类型选择渐变。渐变所用颜色比图标的背景渐变色要亮一些。起始色值和终止色值分别为 #d1e4e8 和 #a9deeb,渐变角度设置为 -45 度,呈现出由顶部的浅蓝色到底部的深蓝色渐变效果。添加内阴影这里的内阴影其实是白色高光,你也可以使用内发光样式。将混合选项设置为正常,距离设置为 0。将大小设置为 70。(注:此处原文为 140px,但是与截图上的参数不符,所以译者暂时将参数改为70px)添加投影最后给这个圆添加投影,让描边看上去更清晰,也可以让整个圆在蓝色背景下看的也很明显。把阴影的透明度设置为 10%,距离设置为 0,将大小设置的稍微大一点,我的参考数值是55。效果如下图所示:步骤5:添加铅笔图标我们在上一步的基础上添加一枚图标,我选的是铅笔图标。你可以在 Sliceberry 或者 the Noun Project 搜索你想要的图标。由于我们制作的图标是
规格的,所以一定要选大图标。如果你也想用铅笔图标,可以从 the Noun Project 下载,作者是 Molly Bramlet,下载链接:download it here将该图标导入你的 PSD 文件并调整大小。如果你用的铅笔图标跟我用的一样大,需要将其缩小到原来的 1/2。你可以利用 iOS 模板把该图标控制在内圆的范围之内。为了让该图标垂直于水平线,需要将其旋转 62.32 度。按下 COMMAND (MAC 用户)或者 CRTL (Windows 用户)键的同时按下 T 键,在顶部紧挨着小三角形图标的窗口中输入数值 62.32。(你也可以跳过旋转图标这一步骤)步骤6:给铅笔图层添加图层样式终于到了图标制作最后的步骤了,我们来给它添加渐变叠加和内阴影。添加渐变叠加打开该图层的混合选项,选择渐变叠加,色值参数同步骤 2,即起始色值和终止色值分别为 #acced6 和 #7cbece。渐变效果沿对角线方向呈现,角度设置为 -45 度,从左上角的浅蓝色开始,到右下角的深蓝色结束。添加内阴影这是本教程的最后一个小步骤。给铅笔图层添加内阴影,让它看起来有些厚度。内阴影其他参数不变,只降低其透明度,参考数值为15%。这是因为图标整体使用的是亮色,所以我们让它有一点阴影的感觉就可以了。最终效果图标到这里就制作完成了。这篇教程的目的就是向你展示漂亮的iOS应用图标制作方法,过程没那么复杂,最终的效果看起来也很棒,你可以使用这个方法尝试制作其他图标。译者:学UI网翻译社-CC原作者:Paula Borowska原文地址:designmodo
上一篇: 下一篇:关于shortcut icon和icon代码的区别介绍(不生产技术,但是我们可以做前端技术的搬运工!)
shortcut icon和icon代码之间究竟有何区别呢.下面介绍一下
语句一:&link rel=&shortcut icon& href=&favicon.ico& /&
语句二&link rel=&icon& href=&animated_favicon.gif& type=&image/gif& /&
备注:语句一 Shortcut Icon 就是在网址列前面出现的Icon
问题:语句二 icon的作用是怎么?和语句一有什么区别?
过去,为保证favicon出现,网站设计者和开发者采用了多种方法。很难明确地保证favicon可以在所有电脑上显示,即使是用同一版本的一种浏览器。
下列代码另一个局限就是它把favicon关联到了某个特定的HTML或XHTML文档上。为避免这一点,favicon.ico文件应置于根目录下。多数浏览器将自动检测并使用它。
建议包含以下两行HTML代码:
&link rel=&shortcut icon& href=&/favicon.ico& type=&image/vnd.microsoft.icon&&
&link rel=&icon& href=&/favicon.ico& type=&image/vnd.microsoft.icon&&
然而,只有第一行是必须的,因为“shortcut icon”字符串将被多数遵守标准的浏览器识别为列出可能的关键词(“shortcut”将被忽略,而仅适用“icon”);而Internet Explorer将会把它作为一个单独的名称(“shortcut icon”)。这样做的结果是所有浏览器都可以理解此代码。只有当希望为新浏览器提供另一种备用图像(例如动画GIF)时,才有必要添加第二行。
在HTML中,link元件必须在head元件里(在&head&和&/head&之间)。
对于XHTML,link必须使用“ /&”结束(或“&&/link&”),而不可以使用“&”结束。
href可以,但不必,指向/favicon.ico的位置。它可以指向任何URL。
图像通常可以使用任何被浏览器支持的图像格式。
.ico文件格式通常可以被所有可以显示favicon的浏览器读取。
设置服务器,以发送正确的MIME标识:
ICO 文件 image/vnd.microsoft.icon(或者亦可出于兼容性原因使用image/x-icon。然而最好使用IANA注册的MIME类型,因为多数主流浏览器现在支持它)
GIF 文件 image/gif
PNG 文件 image/png
使用适当的分辨率和色深。
ICO:包括多种分辨率(最常使用的是16×16和32×32,Mac OS X有时使用64×64和128×128)以及位深(比特每像素)(多数使用4、8、24 bpp,即16、256和1600万色)。
GIF: 使用16×16,256色。
PNG: 使用16×16,256色或24位。
注意:当favicon.ico被置于文档根目录时,将会被一些不处理link元件的浏览器找到,即使没有您的站点上没有指向它的链接。
Favicon功能最早由微软创设,而微软公司的Internet Explorer网页浏览器会对每一个网站都请求favicon。微软支持的link标签不遵从World Wide Web Consortium(W3C,万维网联盟)的HTML建议[1],因为:
rel属性必须包含一个用空格作分隔符的link类型的列表,所以一个包含两词的link类型不能被遵守标准的浏览器理解。
“.ico”文件类型(一种用于Microsoft Windows上图标的光栅格式)没有一个注册的MIME类型,而且似乎在当时也不能被多数浏览器理解。然而2003年,这一格式在IANA获得注册,其 MIME类型是image/vnd.microsoft.icon,进而消除了此问题的第一部分。
在网站上使用保留地址(reserved location)与Architecture of the World Wide Web(互联网的结构)矛盾,同时被认为是link squatting(链接劫持)或URI squatting(URI劫持)。
Mozilla浏览器通过一种遵从Web标准的方法添加了对favicon的支持。它采用rel=&icon&并允许网络设计人员添加任何支持的图像格式的favicon。例如&link rel=&icon& type=&image/png& href=&/path/image.png&&。后来鉴于此功能将被用于所有新内容,多数浏览器都对此功能增加了支持。
38 总笔记数
3.7万 总阅读量
Copyright &
All Rights Reserved.
合作伙伴:虽然很不情愿,但还是要提前祝有情人终成眷属/doge
一直以来我们都总是会习惯性地认为 macOS 是极致安全的操作系统,黑客啊木马什么的和...
我们当务之急恐怕不是盯着Ti7能不能来到中国,而是需要通过S7这样难得的大型赛事去积...
听起来是挺炫的,就是不知道实物打造出来是什么样子。
使用中文语言的用户,Cydia的性能据说会大幅提升。
苹果已经将 OS X 系统更名为 macOS,但是仍有不少用户需要使用到老版本 OS X 系统的特...
三星每年都会更新旗下各系列的产品阵容。
尽管参数图很快被删除,但外观图还是被保存了下来,预计将亮相2017世界移动通信大会(M...
本身奇葩的画风以及简单的操作都会让玩家对其产生浓厚的兴趣,而游戏中无处不在的幽默...
【因果循环只为逃出生天:因果】在这款游戏中,玩家会来到一个奇怪的外星世界,在这里...
主人公在分裂的记忆之中不断穿行,尽管周围的一切都是如此的熟悉,但她的脑海中依然没...
威锋网曾经报道了由Blue Wizard打造的游戏新作《远离杀戮营地(Slayaway Camp)》即将...
本作的故事讲述了粗心的蕾拉·格林博士在实验时释放了无数的恐怖生物,为了弥补她犯下...
本作在移植的过程中对原有版本进行了一定的修改,使之能够更适应移动端玩家的操作习惯...
近日在苹果商店当中上架的《场景管理员(Stagehand: A Reverse Platformer)》中玩家...
看完全文表示没钱就自己动手吧,别想什么都让机器和设备来帮你搞定。
ZENS 保护壳目前已经通过了 MFi 和 Qi 认证,这意味着它可以和市面上的绝大多数无线充...
有人喜欢无线耳机,自然也会有人喜欢“有线耳机”。
将功能强大的电子产品便携化并随身“穿戴”一直是科技工作者努力的目标。而今天,梦想...
近日,一位名叫 dodiu 锋友分享了自己使用群晖 Docker 玩转 Homekit 的过程。
台湾友讯科技公司已经在欧洲市场推出了兼容 HomeKit 的 Omna 180 高清安全摄像头。
总之开心就好,不过应该也会有不少人喜欢这些手机壳的吧~
苹果还是自己造显示器吧,感觉其它公司不是这么靠谱。
晒晒自己做的美化图标,全部都是玻璃效果 累死了。附上替换教程及自己做的图标素材
注册时间 最后登录
在线时间1413 小时 UID
主题帖子人气
金苹果, 积分 2080, 距离下一级还需 920 积分
本帖最后由 skywindonline 于
00:22 编辑
不喜勿喷 好不容易花了12个小时用了两天才把所有图标都换成了玻璃效果 蛋碎啊 图标全部都是我自己做的嘿嘿更新:有不少封釉要我发分享,在这里我要说明一下,我接下来会发一下修改的教程和我做的图标资源,不喜欢的可以不要下载也不要来我帖子,但是文明很重要,一个手机一个系统,我喜欢IPHONE不仅仅是因为他的UI更多的是它流畅的操作性,那些说什么我不适合苹果的可以离开我帖子,因为我喜欢用什么就用什么,不需要别人来对我指手画脚,今天我在这里晒我的美化只是让那些喜欢玻璃风格的封釉看看,如果喜欢我也可以放教程和资源,青菜萝卜各有所爱文明看帖文明回帖这很重要,不然以后谁还发技术分享贴?=====================我是华丽的分割线===================
=========================================================
接下来我开始说明具体换的过程,首先你得先去/System/Library/PrivateFrameworks/MobileIcons.framework这个路径里删除
AppIconMask@2x~iphone
DocumentBadgeMask-145@2x
SpotlightAppIconMask@2x
TableIconMask@2x
这4个文件,删除之前请备份(不用担心,这4个文件只是图标的黑色背景而已,不过备份一下比较好)
然后把我附件里的素材按APP的名字用PP助手之类的助手文件,放到每个APP的文件夹里,这些APP基本进去之后都会用APP名字加APP后缀的文件夹(比如说QQ那么他的路径就是/var/mobile/Applications/QQ/QQ.app)
总之就是有很多PNG图片的一个文件夹里,不放心可以进去看看确定一下
PS附件大多数的程序名字我都已经改好了,但是我不保证全部都改好了,因为实在太多了,这样都花了我12个多小时两天时间了省了做图标的时间改改名字应该可以吧
然后就是附件里没有报刊杂志,因为我找不到报刊杂志的文件夹,所以我的解决办法就是直接cydia搜索一个叫nonew什么什么的插件,直接让它变没,反正也很鸡肋对我没用
提醒封釉一点,删除上面4个文件之后会导致图标变方,改了我的透明图标就没事了,有强迫症的可以选择不弄,我不想又被喷什么把你图标变方了,那很正常,以后APP更新了也会变方重新把图标换进去就好了
最后如果注销没变化的话请到/User/Library/Caches/com.apple.IconsCache 这个路径下把除了__system_version_info__这个文件以外的其他所有文件都删除然后注销就好了(不用担心,那些只是图标缓存文件而已,很快又会出来的,就是每次换完图标如果没显示都需要这样操作,所以比较麻烦一点而已)
刚在一个帖子看到貌似能用PP助手的修复图标功能,本人没试过,封釉可以试试===================分割线来了================
============================================
此外对于小白我想说的是修改文件有风险,做好备份最重要,APP还好,系统自带的程序一定千万要做好备份,怕出问题可以不折腾,别说我没提醒,万一删错文件白苹果了或者有什么问题可不关我的事,文件教程我分享了,自己动手丰衣足食,喜欢的可以拿去,不喜欢的也不要跑来我帖子喷我,每个人审美不同,不要企图强行把别人的审美弄的跟你一样,因为你的审美也未必能好过别人,手机这东西自己用的舒服就好==============我是华丽的分割线==================
==========================================
==============在下是牛逼的分割线[s:89]=================
再次更新:有封釉问我要完整的华康少女字体,其实这个字体我也是从一位封釉那拿来的,分享给大家吧 链接在此最新更新,添加了Flex 快播 1024客户端 这三个APP的玻璃透明图标,直接拖进APP覆盖就好
(102.33 KB, 下载次数: 30)
02:23 上传
(102.16 KB, 下载次数: 15)
02:23 上传
(105.17 KB, 下载次数: 18)
02:23 上传
(103.79 KB, 下载次数: 16)
02:24 上传
(106.08 KB, 下载次数: 33)
02:24 上传
(107.08 KB, 下载次数: 13)
02:24 上传
(104.22 KB, 下载次数: 15)
02:24 上传
17:10 上传
点击文件名下载附件
422.79 KB, 下载次数: 268
17:13 上传
点击文件名下载附件
3.78 MB, 下载次数: 239
00:19 上传
点击文件名下载附件
278.24 KB, 下载次数: 136
<p id="rate_23477" onmouseover="showTip(this)" tip="&a
href=&forum.php?mod=redirect&goto=findpost&ptid=7559287&pid=&fromuid=1&&&span &技术贴满分,不过我喜欢透明磨砂的图片。&/span&&/a&&人气 + 5
" class="mtn mbn">
<p id="rate_17605" onmouseover="showTip(this)" tip="威锋有你更精彩:)&人气 + 1
" class="mtn mbn">
<p id="rate_86932" onmouseover="showTip(this)" tip="&a
href=&forum.php?mod=redirect&goto=findpost&ptid=7559287&pid=&fromuid=1&&&span &精品文章^_^&/span&&/a&&人气 + 5
" class="mtn mbn">
<p id="rate_84531" onmouseover="showTip(this)" tip="&a
href=&forum.php?mod=redirect&goto=findpost&ptid=7559287&pid=&fromuid=1&&&span &u000du000a感谢分享^_^&/span&&/a&&人气 + 1
" class="mtn mbn">
<p id="rate_87642" onmouseover="showTip(this)" tip="感谢分享^_^&人气 + 1
" class="mtn mbn">
<p id="rate_27615" onmouseover="showTip(this)" tip="好厉害&人气 + 1
" class="mtn mbn">
<p id="rate_25348" onmouseover="showTip(this)" tip="&a
href=&forum.php?mod=redirect&goto=findpost&ptid=7559287&pid=&fromuid=1&&&span &满上,真的挺好看&/span&&/a&&人气 + 3
" class="mtn mbn">
<p id="rate_8692" onmouseover="showTip(this)" tip="这个技术流,必须支持!~~&人气 + 3
" class="mtn mbn">
<p id="rate_98361" onmouseover="showTip(this)" tip="&a
href=&forum.php?mod=redirect&goto=findpost&ptid=7559287&pid=&fromuid=1&&&span &每个人审美不同,不要企图强行把别人的审美弄的跟你一样,因为你的审美也未必能好过别.&/span&&/a&&人气 + 4
" class="mtn mbn">
<p id="rate_85750" onmouseover="showTip(this)" tip="&a
href=&forum.php?mod=redirect&goto=findpost&ptid=7559287&pid=&fromuid=1&&&span &留名&/span&&/a&&人气 + 1
" class="mtn mbn">
<p id="rate_98988" onmouseover="showTip(this)" tip="晒个教程吧
感觉自己动手的好&人气 + 1
" class="mtn mbn">
<p id="rate_70609" onmouseover="showTip(this)" tip="&a
href=&forum.php?mod=redirect&goto=findpost&ptid=7559287&pid=&fromuid=1&&&span &分享&/span&&/a&&人气 + 2
" class="mtn mbn">
<p id="rate_19488" onmouseover="showTip(this)" tip="&a
href=&forum.php?mod=redirect&goto=findpost&ptid=7559287&pid=&fromuid=1&&&span &4S 的时候都用这个图标,求资源啊&/span&&/a&&人气 + 1
" class="mtn mbn">
<p id="rate_1234" onmouseover="showTip(this)" tip="&a
href=&forum.php?mod=redirect&goto=findpost&ptid=7559287&pid=&fromuid=1&&&span &很喜欢,分享一下吧&/span&&/a&&人气 + 2
" class="mtn mbn">
<p id="rate_3033" onmouseover="showTip(this)" tip="&a
href=&forum.php?mod=redirect&goto=findpost&ptid=7559287&pid=&fromuid=1&&&span &哇,好棒啊,赶紧分享出来吧。好让我下载下来再狠狠的删掉!!!!.&/span&&/a&&人气 -1
" class="mtn mbn">
<p id="rate_75182" onmouseover="showTip(this)" tip="威锋有你更精彩:)&人气 + 1
" class="mtn mbn">
评分次数19
威锋有你更精彩:)
感谢分享^_^
这个技术流,必须支持!~~
晒个教程吧
感觉自己动手的好
威锋有你更精彩:)
注册时间 最后登录
在线时间628 小时 UID
主题帖子人气
你好,我家没水表
注册时间 最后登录
在线时间1325 小时 UID
主题帖子人气
跟我小米上装的主题一样
注册时间 最后登录
在线时间300 小时 UID
主题帖子人气
注册时间 最后登录
在线时间23 小时 UID
主题帖子人气
技术流,这个要支持一下!
注册时间 最后登录
在线时间1 小时 UID
主题帖子人气
目测女的不是楼主就是楼主老婆?
注册时间 最后登录
在线时间823 小时 UID
主题帖子人气
对skywindonline于 02:24:38在楼主发表的内容评分:人气:+5;
不喜勿喷 好不容易花了12个小时用了两天才把所有图标都换成了玻璃效果 蛋碎啊 图标全部都是我自己做的嘿嘿原创内容^_^ 自己动手丰衣足食!
注册时间 最后登录
在线时间1413 小时 UID
主题帖子人气
好吧回2楼梦想这个东东于1 小时前发表的: 跟我小米上装的主题一样......
注册时间 最后登录
在线时间1413 小时 UID
主题帖子人气
审美不同 我蛮喜欢的回3楼ha88199于1 小时前发表的: 不好看!......
注册时间 最后登录
在线时间1413 小时 UID
主题帖子人气
感谢支持哈回4楼xiao9me于1 小时前发表的: 技术流,这个要支持一下!......
威锋旗下产品
Hi~我是威威!
沪公网安备 29号 | 沪ICP备号-1
新三板上市公司威锋科技(836555)
增值电信业务经营许可证:
Powered by Discuz!

我要回帖

更多关于 上传图片icon 的文章

 

随机推荐