立体感+-网店旺铺动态页面快速实现-(含光盘1张)

内容简介

立体感+——网店旺铺动态页面快速实现（全彩）(含DVD光盘1张)是一本专门用来帮助大家学习装修代码的图书，共分为10 章，从基础知识到
Div+CSS，再到淘宝的widget 都有涉猎，适合有一些美工基础的美工或掌柜用来
学习装修代码知识。在每一章的后面还会有一些小技巧来解决大家工作中碰到的实际问题。本书不是一本严肃的代码类参考书，更注重帮助大家理清装修代码的脉络，让你对代码有更清晰的认识，让你更快上手。

目录

第1 章 每个电商美工都应该知道的基础
1.1 每个美工都应该知道的基本常识.................2
1.2 切片.........13
1.3 店铺装修后台.....................27
经验分享——Photoshop CC 版本快速切片..35
第2 章 Dreamweaver 与代码入门
2.1 代码和Dreamweaver........40
2.2 HTML 与Dreamweaver....45
2.3 表格.........53
2.4 CSS 样式与Dreamweaver.............................58
经验分享——如何制作单像素的表格............62
经验分享——为什么上传后图片大小/ 质量会改变?...........65
第3 章 一切从框开始，介绍盒模型
3.1 认识div.................................68
3.2 盒模型....................................74
3.3 框的背景...............................80
经验分享——用热图为大的图片添加链接..84
第4 章 好玩的布局方法让框浮动起来
4.1 简单的N 列布局................88
4.2 更复杂一点的浮动样式.................................96
4.3 用嵌套来实现复杂布局.................................99
4.4 一行N 列在店招上应用的案例............... 102
经验分享——解决店招和导航之间的2 像素的空隙........... 109
第5 章 再复杂的布局也没问题：定位的技术
5.1 相对定位............................ 112
5.2 定位............................ 115
5.3 借用淘宝的样式............. 124
经验分享——用定位来做客服列表.... 128
第6 章 让你的店铺突破950 的宽度
6.1 突破950 的原理............. 134
6.2 实际操作步骤.................. 141
6.3 突破中的其他问题......... 146
经验分享——如何用自定义导航替代官方的导航................ 153
第7 章 在框里填充内容
7.1 插入文字............................ 156
7.2 插入图片............................ 167
7.3 插入视频............................ 170
经验分享——在描述中的图文混排.............. 176
第8 章 用CSS3 让页面动起来
8.1 hover 鼠标响应效果...... 181
8.2 更平滑的动画效果......... 190
8.3 同时产生多个动画......... 194
8.4 更多的动画效果............. 200
经验分享——店铺装修常见问题.................. 207
第9 章 淘宝官方的widget
9.1 widget 简介...................... 211
9.2 标签页、卡盘、旋转木马......................... 213
9.3 手风琴................................. 220
9.4 弹出层................................. 225
9.5 ................................. 229
经验分享——做自定义导航和弹出菜单.... 234
第10 章 淘宝官方社交组件的应用：sns 及其他
10.1 评论组件......................... 244
10.2 喜欢组件......................... 249
10.3 分享组件......................... 252
10.4 其他................................... 255
经验分享——如何获取店铺ID 和商品ID................................ 262
附 录 淘宝的常用widget 参数列表

摘要与插图

说到淘宝网店装修代码，很多卖家、美工会觉得很难，总是会怀疑自己能学
的会么？事实上代码确实会涉及很多基础知识，需要比较长的时间去掌握它。但
是如果通过工具来制作，它其实比设计要简单很多，因为设计是活的，而代码知
识相对比较死板，只要熟悉了，它们就会成为你的工具而不是障碍。另外，我们
需要的不是一个大而全的详细的手册和规则类的代码课，只要能做出想要的布局
和效果即达到目的。每天坚持学习一点，在一个月的时间内达到够用的程度对大
多数人来说是没有什么问题的，所以如果你为了装修店铺而去学习装修代码，不
用怕，你肯定行的。
从2011 年开始进入淘宝，并成为淘大讲师开始上美工类的课程后，我对上面
所说的情况有深的感触，因此也一直有这个想法来写这样一本书，来帮助从事
电商工作的掌柜和美工来了解装修代码，让淘宝网店装修代码不再成为我们工作的
障碍。
本书先介绍了基础的切片和HTML+CSS 知识，然后开始把所有的HMLT
标签归结到框中，在了解了框的基础知识后，开始用框来做大的布局（包括浮动和
定位两种方法），然后讲解了在框里填充内容的相关代码知识，到这里我们的基础
代码部分就完成了，在工作中遇到的代码问题80% 基本可以通过这些知识来解决。
进阶的内容部分介绍了如何用CSS3 让页面产生动态，针对淘宝装修的特殊情
况，介绍了widget 相关组件的知识。这些知识其实在淘宝开放平台是公开免费的，
只是很少有人会告诉你。
如果你以前接触过HTML 和CSS，学习这本书的时候会格外轻松。如果你完
全没有基础，建议一定要照着书的实例多动手实际操作，有助于你加深理解。另外
在随书光盘中，每一章都配有一段视频，来帮助大家整理思路，刚接触代码的新手
一定要看一下哦。
这是阿灰第一次通过书的形式给大家讲解这方面的知识，可能会出现很多纰
漏和问题，大家可以通过新浪微博@ 淘大阿灰猿、微信公共平台ahuips 或论坛
http://bbs.ahuips.com 来与阿灰沟通和反馈，感谢大家的支持。