一图多超链接
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
(不要在这里做广告啦,在做就要求管理员删帖封号)第一章节怎样制作一张图上有多个宝贝超链接的代码,非常简单。
大家是来学习的,废话我就不多说啦,现在就开始吧!Let’ go……
∙首先去下载一个“可牛影像”(俗话说的好,“欲那个什么,就必先利其器”),这是一款图片编辑软件,属于傻瓜式的,和光影魔术手、美图秀秀类似,也是免费软件,里面很多素材会经常更新的。
∙打开软件后可以看见(如图1)这2个椭圆的地方都可以直接打开一张本地图片进行编辑,在方形标注的地方可以新建一个您自己指定尺寸的图片背景,颜色也可以设定,如图2.
图1
图2
简单的熟悉了一下软件,下面我们来做多图效果。随便打开一张你电脑里的图片,当然你可以打开你要编辑的图片了,这个无所谓,因为稍后可以修改的。
打开图片以后找到左上角的“编辑”,点击一下,左边就会出现编辑类目如图3
现在进入主题,首先你要明确你是要创建规则的多图效果还是不规则的多图效果
如果做规则的效果就点击左边“多图拼贴”,此时会弹出一个新的多图编辑窗口,如图4
图3
图4
1处是显示所有小图片的地方,可以在这里批量添加图片,把它们组合在一起,点击马赛克的地方就可以更换图片了,不过更简单的办法是双击2处每一个黑色区域就可以快速的实现更换小图,这也是为什么当时打开第一张图
片的时候可以随便打开一张,因为这里可以随便更换你的小图。把每个黑色区域都换上你想要添加的小图,这些小图的主体如果不是在中间,还可以拖动进行调整(建议准备小图的时候不要图片整体太大,而主体过小的图片,应该截取主体和背景比例都差不多的小图片)。3处就是多图效果的参数啦。图片间距是指2张图片之间以及边框的宽度,建议不要调的太大,调到3就差不多了;高宽比这个参数大家也可以试试,就会看见效果了,背景颜色是指刚刚我们提到的黑色区域,也就是最后图片的边框颜色啦,这个也很重要,因为如果整个多图效果是用在你的店铺装修上的,那请把颜色设置和你店铺风格颜色一致或相近的颜色风格,这样会协调一点。背景大小其实就是指多图效果的图片尺寸啦。注意:如果想调整到你想要的效果,需要和上面的宽高比参数一起设置,因为宽高比不一样,你尺寸调的一样,整个图片的效果也是不一样的,具体的大家可以调整一下试试看。如果是把这个多图效果用在装修店铺的通栏,那就把宽高比设置成70::30,同时把尺寸的宽度设置成950(店铺通栏的宽度是950),高度就不要管了,因为宽高比和宽度设置好了,高度就是一个定值了。4处是调整组合样式,也就是你想让你的多图组合是简单的一排多个的排列还是双排或者是其他组合样式,可以在这里选择,里面很多种类,针对你宝贝展现的主题进行选择,比如说如果是裙子想要人家看见整体效果就选择宽度比较窄,高度比较高的小图组合方
式;如果是短裤就可以选择小一点的小图组合,大家可以自己研究一下。编辑好的如图5
图5
这些都设置好了以后就可以点确定啦,此时又进入首页状态了,这个时候可以直接点击保存啦,此时跳出保存参数设置,选择好保存的路径,名称和格式。
重要提示:如果你保存的是JPG的格式时,要把下面的图片质量调整杆调到最高值,这样才能保证你保存图片的清晰度。
现在说说不规则多图效果的创建
那就在打开一张图后点击左边的“自由拼贴”如图3,此时会弹出一个自由拼贴的编辑窗口,如图6
图6
a处是编辑背景色和前景色的地方,
背景色:是你的小图后面被填充上的颜色,如图6 c处的格子布背景。背景可以在e处更换。
前景色:就是指你的小图啦。在下面b处的地方可以随便添加你的小图。
在编辑区c处和d处可以随便调整图片的大小和旋转等。
重要提示:做自由多图编辑的时候,背景图片的尺寸(也就是你最终得到的多图效果的尺寸)是不能动态调整的,你只能在你的电脑上先做好你需要的
大小的背景,然后再这里更换掉就可以了。
都设置好了以后就可以确定保存啦。
大家在作图的时候还可以摸索一下其他比较实用的功能,比如添加特效文字,个性边框等等。
好啦,第一章节完毕,我下面教大家怎样用Dreamweaver给一张图上的宝贝添加超链接制作代码和店铺装修如何使用这些代码。请大家支持并希望想学习的兄弟姐妹继续看下去!谢谢!
--------------------------------------------
第二章节新手装修必备之技术篇---制作宝贝多图效果图片代码
虽然文字有点多,但是很容易懂的
1.接着我上一篇“怎样用可牛软件制作多图效果”的姊妹篇,首先去下载一
AdobeDreamweaver CS4,这个网上有很多
破解版和绿色版的,我不知道这里可不可以发地址链接,为了安全起见还是不发了,如果你找不到,可以旺旺我,发给你。专业的网页制作软件,“三剑客”之一,
主要是做代码。Let'go......
首先打开软件看见的是初始状态(如图1),你可以从“文件”中新建,也可以直接点击“HTML”。Dreamweaver功能很强大,因为我们要实现的是在一张大图上做多个宝贝的超链接,所以只用“HTML”这个功能就可以啦。点击后出现如图2
的编辑状态
图1
图2
2.下面就是要插入图片了,在插入图片之前要把光标放在a或b的位置,然后点
击c插入“图像”,会弹出窗口,在这里找
到你电脑中做好的图片插入进去,支持多种格式的图片,但是考虑到淘宝允许的图片格式,我还是建议选择jpg、png格式的比较保险一点。在这里我们选择上次做好的组合图片,选择好图片后会跳出来如图3和图4的窗口,不用管它,都直接点击“确定”,这样我们就把图片插入进去了。
图3
图4
下面我们选择整个窗口左下角的一个命令符号如图5,红色椭圆标记的命令就是“绘制矩形热点”(所谓热点就是可以点