准备工作:DW CS5版本、PS CS5版本(DW全称Dreamweaver,PS全称Photo Shop,CS5为软件的版本,不同的版本所拥有的的功能也不同,建议学习本帖的同学还是下载相同版本的软件,如果您遇到问题,我才能很好的帮您解决)、纸笔等。
第一步:前期筹划:在制作表格促销模块时,我们得先考虑好表格的大小,以用来链接大小合适的图片,所以此时【纸笔】必不可少。首先,通栏的尺寸为950,所以表格的宽度定为950,具体的高度还是按照您自己要设置的大小来确定。我选择的表格大小是950*580,具体表格分布为5行7列。先弄出一个大概图给大家看看:

第二步:打开DW设计软件:新建一个HTML页面,快捷键为Ctrl+N,如图


接着,我们点击【插入】菜单,这是可以看到【表格】项目,点击,在表格中输入【5行,7列,表格宽度950,边框粗细0,单元格边框、间距0,标题选择“无”】,如下图


又有人会问,单元格的大小设置到底该怎么设置呢?各位亲,请别急,酸儒我先去喝口水!
首先,将鼠标定位在一个单元格中,此时在下面的【属性】栏中,会出现相应的属性,我先示范左边方格大小的设置,其他的设置雷同。
按照,我的方法,将所有的表格大小确定好后,接着要做的工作就是将相应的促销图片放入表格中。这时先不着急插入图片,而是先插入一个【图像占位符】,主要是为了大家以后可以再次利用这个模块。

大家,还是先看到左上角的菜单栏【插入】,点击,选择【图像对象】→【图像占位符】,点击鼠标,出现如图对话框

有时候,你要制作的表格模块,边框是没有颜色的,选择的底色又是白色,没法区分开背景,此时你只需在【页面属性】中选择【背景颜色】,此时制作出来的表格就很刺眼了,看出了整体的布局。什么??不信??那你还是试试吧……


在刚做好的表格中,点击任意一个【图像占位符】,下面的【属性】栏中会出现相应的属性,在【源文件】一项中填入促销宝贝的图片,【链接】出填上相应的宝贝详情地址,【目标】处选择“_blank”,这个选项的作用是使被链接的宝贝能在新的窗口打开。


推荐阅读:"装修大师"让视觉营销立马出彩
https://www.kaitao.cn/zhuangxiujingyan/20130201113800.htm 查看更多相似文章