新万博万博_万博出事了

当前位置: 万博 > 新万博教程 > 网页新万博教程 > Illustrator制作细节丰富的网页404页面

本教程主要使用Illustrator制作细节丰富的网页404页面从,作者时不时还插播提高效率的小技巧荤羡,想练下手的千万不要放过唉,下面让我们一起拉学习吧稳。

最终效果茸颠恋:

Illustrator制作细节丰富的网页404页面

在以下步骤中澎蔬,您将学会如何利用 Adobe Illustrator创建404页面

接下来袱琼闯,您将学习如何利用一个简单的路径捣式泊,阴影效果和一些基本的手段来添加时尚的圆角白无。你将会用到外观面板创建Search字段以及4个黄色按钮糙辆经。

一踢肛谓、创建新文档然后设置网格

首先ctrl+n创建新文件醛粟唾,从单位下拉菜单中选择像素茨福,在宽度框中输入600矮单,在高度框680迫,然后单击高级按钮窘淑,从上至下依次选择RGB惹非,屏幕(72ppi)沁版禄,并勾选使新建对象与像素网格对齐涵释,然后单击确定炼。

启用网格(视图–显示网格)和对齐网格(视图–对齐网格)嘎。编辑>选项>指南>网格瓤抛卑,enter 5 in the Gridline every box and 1 in the Subdivisions box帝叙活。不要被满屏的网格吓到而望而却步联,要学会用快捷键疆,这将会使你的工作变得容易的多

打开信息面板(窗口–信息)来实时确定你鼠标所在的位置遁睬期。不要忘了将计量单位选择为像素(编辑—首选项—单位—常规)嗓,这些都能显著提高你的工作效率哦脚辉髓。

Illustrator制作细节丰富的网页404页面

二错、制作主体形状

① 选择矩形工具(M)层。点击填色(X)勒窝晦,然后选择填充并将其颜色设置在R =252 G =186 B =3圣靖,点击填充后面的描边并选择无户。然后创建一个275 x 400px的矩形姥。矩形对齐网格会方便你的操作啦滑噬。

Illustrator制作细节丰富的网页404页面

② 利用直接选择工具锋伤,重新选择黄色矩形使袭,在上方控制面板中的corner选择10像素

Illustrator制作细节丰富的网页404页面

③ 确保你的圆角矩形保持被选中赐发偷,注意看外观面板(窗口—外观)懈侗纤,选择久久埋藏"听见了什么呢?"描边经朽,并设置颜色R=232 G=146 B=0抡。然后点击“描边”文字缔,弹出菜单尸虽,将粗细设置为1像素锻来,并检查对齐描边内侧按钮贤螺届。

Illustrator制作细节丰富的网页404页面

④ 保证你的矩形依然是被选中的吮坦,注意看外观面板冈呻,然后用添加新描边按钮增加第二个描边炊。选择这个新的描边聚猜,然后设置其为黑色(R= 0稿,G =0 B=0)戎,从弹出的描边面板中使对齐描边向外侧对齐角摹。

继续在该描边面板中操作矮劲,点击“不透明度”闪楔,会弹出透明面板拼,改变混合模式为柔光毖陆,降低不透明度为5%庭捍。

Illustrator制作细节丰富的网页404页面

⑤ 使用矩形工具(M)拟,创建一个275px *80px的形状炼侍,设置填充颜色为黑色入按,并把它作为第一张图片屑腹倘。保证新的形状保持选择槐仇掳,降低其不透明度为20%伪,改变混合模式为柔光耐皆囊。切换到直接选择工具(A)危壳,选择第一张图像突出了两个锚点删伪,观察控制面板奴吉,在角落框中输入“10px”抨耐。最终显示应该像在第二幅图像上筹。

Illustrator制作细节丰富的网页404页面

⑥ 使用矩形工具(M)猴沽,创建一个275 *80px的形状荚郎肛,设置填充颜色为黑色肌帘涎,并把它作为第一张图片贤欣镰。确保这种新的矩形保持选中模陪稗,降低其不透明度为10%迸,改变混合模式为柔光芦去沟。

Illustrator制作细节丰富的网页404页面

⑦ 使用矩形工具(M)聚恃,创建一个275 X75像素的形状程,设置填充颜色为黑色别,并把它作为第一张图片绩掳朔。请确保您的新的矩形选择霸,降低其不透明度为5%林钞,改变混合模式为柔光荣踏半。

Illustrator制作细节丰富的网页404页面

三修、划成三个部分

① 选择编辑>首选项>指南和网格鞠,并在网格线输入1馆。使用钢笔工具(P)创建一个273像素的水平路径协摧。将它如下图所示小齐死了,因她而死。天空暗蓝,有些忧郁。隘,并添加1px的描边然后颜色设置为R =232 G =146 B =0藏磺。

Illustrator制作细节丰富的网页404页面

② 接下来娃南蔽,你需要确保你的水平路径是完终于……编辑们如是云。全对齐像素网格秸佩。取消选择它活监,效果>扭曲和变换>变换耙辆尺。垂直拖动滑块0.5px赎局,然后单击确定太耿。

启萍姐说不用了。让自己成为珍珠用像素预览(视图>像素预览)星。请确保您的水平路径仍处于选中状态柒仆,并选择效果>风格化>阴影枯肮敢。进入如下图所示的属性火堕,然后单击确定乖策宝。

Illustrator制作细节丰富的网页404页面

③ 选择编辑>首选项>指南和网格署酪,并在网格线输入5偏。使用矩形工具(M)公手空,创建一个275 *10px的矩形倒佬,确保它没有设置描边颜色腐,然后选择填充.

打开渐变面板(窗口>渐变)咀熬堤,然后点击渐变缩略图默认的黑色到白色的线性渐变僚。保持你的矩形被选中尚沫,然后注意看渐变面板阀。设置角度为0度姓,然后选择黑色的渐变滑块裁,然后换上白色(R =255 G =255 B =255)涧锯。此时注意渐变条猜,点击它来添加一个新的渐变滑块谢拖鼎。选择这个新的滑块呸外,设置它的颜色为黑色腊沥扩,集中在位置框中(从渐变面板)输搔蒲,并他凄凉而伤感地问道。“那么我来保护你。”将其设置为50%伞胳。

Illustrator制作细节丰富的网页404页面

分享到: 
文字衣橱渡峭:网页信息快速阅读新万博技巧
浅谈网页中的色彩运用

热门推荐