本节课程讲解整体页面常见的装修方式,由于现在的店铺更加偏向于视觉营销,所以装修动效偏少了,学完本课内容后,同学们可以在下方评论区进行留言,作业也可以在评论区进行提交,老师会一一解答。
我们开始今天的课程吧。
1.打开一个店铺,鼠标右击选择【审查元素】,可以看到有个【map】使用热点地图制作,如图所示。
2.接下来演示一下切图,打开一个店铺,找到一张图片,另存为电脑上,用【PS】打开,如图所示。
3.在图片合适的位置拉上参考线,使用【切片工具】在菜单栏点击【基于参考线的切片】将图片切开,如图所示。
4. 使用快捷键【Alt+Shift+Ctrl+S】另存为Web所用格式,点击【存储】,选择格式为【JPEG】,品质为60,如图所示。
5.在淘宝装修页面将所切的图上传,打开【码工助手】, 在【其他效果】 里找到,宽度为1920,高度为393,将图片的链接地址粘贴,点击【生成代码】如图所示。
6. 将生成的代码复制,在装修页面点击【编辑】,【显示标题】改为不显示,点击确定,预览一下效果如图所示。
7. 接着来做第二个模块,拖过来一个【自定义模块】,复制第二张图的链接地址,在【通栏模块】里设置,参数如图所示。