如有网店模板制作与设计全流程(二)

资料内容仅供您学习参考如有不当或者侵权请联系改正或者删除。

我们先看例子,先在PS中做切片,这是已经切好的摸版,切片不能乱切,切的时候要规整,方便后面的网页制作,而且直接影响最终的效果。这里切片01以后是要做滚动公告的,为了少切几个片片,我把放置公告的图片放在了这个切片的正中,切片04、 06、 07、 08是要做链接的地方,因此单独切出来了,切片11、 12、 13、 14、 15、 17、 19、 21都是以后需要无限延伸的,也单独切出来。

做切片的时候一定要方便后面的网页处理。

资料内容仅供您学习参考如有不当或者侵权请联系改正或者删除。

资料内容仅供您学习参考如有不当或者侵权请联系改正或者删除。我把整个摸版横向切成了整齐的五个部分,这样,后面的表格拆分就方便了。

资料内容仅供您学习参考如有不当或者侵权请联系改正或者删除。

资料内容仅供您学习参考如有不当或者侵权请联系改正或者删除。

之后,我们要在PS里存储这些切片,菜单-文件-存储为Web使用格式会出现一个对话框,这里能够设置图片的存储格式和品质,我们把它存在预设好的文件夹里,方便以后的查找

好了,PS里的工作完成了,先别着急关了这个图片,后面我们网页处理的时候还用的到的。现在打开D rea mweaver,新建一个文件,然后插入一个表格,这个表格是与你设计的摸版同宽的,无限延伸的摸版制作关键在于表格嵌套(就是表格套表格)以后我们所有的表格拆分和嵌套都在这个表格里完成。

资料内容仅供您学习参考如有不当或者侵权请联系改正或者删除。

资料内容仅供您学习参考如有不当或者侵权请联系改正或者删除。

调整一下表格,把它拉长些,表格属性为(水平-默认,垂直-顶端)然后我们开始第一部的拆分。制作好的摸版横向是整齐的五个部分,我们先把这个表格拆成五行

注意:操作时都要先选中要操作的表格才能进行,不要忘记呀

资料内容仅供您学习参考如有不当或者侵权请联系改正或者删除。

资料内容仅供您学习参考如有不当或者侵权请联系改正或者删除。

接下来我们继续拆分第一部分的表格,第一部分是切片01、 02横向放置,因此把第一个表格再拆成2列就能够了。