More Related Content Similar to 旺铺高级模板制作培训 (20) 2. 级 结构
级 Layout
级 块 Module
级 组 Widget
11. J_TRegion 块 J_TBox
.tb-shop
.J_TRegion
.J_TRegion
12. J_TRegion 块 J_TBox
.tb-shop
.J_TRegion
.J_TBox .J_TBox
.J_TBox .J_TBox
.J_TBox .J_TBox
.J_TBox .J_TBox
.J_TRegion .J_TBox .J_TBox
26. 级 结构
录结构
态资
页
块 录 块
块 码
27. 级 结构
录结构
态资
页
块 录 块
块 码
块
38. 级
CSS 码
规
ID选择 #box
CSS选择
39. 级
CSS 码
规
ID选择 #box
CSS选择
40. 级
CSS 码
规
ID选择 #box
CSS选择
41. 级
CSS 码
规
ID选择 #box
CSS选择 选择 .tb, .tb-shop
42. 级
CSS 码
规
ID选择 #box
CSS选择 选择 .tb, .tb-shop
43. 级
CSS 码
规
ID选择 #box
CSS选择 选择 .tb, .tb-shop
44. 级
CSS 码
规
ID选择 #box
CSS选择 选择 .tb, .tb-shop
选择
.Content,.CONTENT
45. 级
CSS 码
规
ID选择 #box
CSS选择 选择 .tb, .tb-shop
选择
.Content,.CONTENT
46. 级
CSS 码
规
ID选择 #box
CSS选择 选择 .tb, .tb-shop
选择
规则 .Content,.CONTENT
47. 级
CSS 码
规
ID选择 #box
CSS选择 选择 .tb, .tb-shop
选择
规则 .Content,.CONTENT
CSS 单
53. 级 块
块
统 块 Private System Module PSM
54. 级 块
块
统 块 Private System Module PSM
统 块 Public System Module PBSM
55. 级 块
块
统 块 Private System Module PSM
统 块 Public System Module PBSM
户 块 User Module
56. 级 块
块
统 块 Private System Module PSM
统 块 Public System Module PBSM
户 块 User Module
58. 级 块
块: include_modules();
59. 级 块
块: include_modules();
64. 级 块
UM 块 发 php
ad_700.php
65. 级 块
UM 块 发 php
ad_700.php
66. 级 块
UM 块 发 php
ad_700.php
块标识
67. 级 块
UM 块 发 php
ad_700.php
块标识 块toolbar
68. 级 块
UM 块 发 php
ad_700.php
块标识 块toolbar
获 户
70. 级 块
UM 块 发 xml
module.xml
71. 级 块
UM 块 发 xml
module.xml
73. 级 Widget
Widget
Tabs - 标签页
Slide - 盘
Carousel - 转 马
Accordion - 风
Popup - 弹 层
77. 级 Widget
Widget
调
widget标
识
78. 级 Widget
Widget
调
widget标 widget
识
79. 级 Widget
Widget
调
widget标 widget
识
widget
81. 级 Widget
Widget
DOM结构
82. 级 Widget
Widget
DOM结构
widget
widget DOM结构
Editor's Notes 演讲形式： 结合Mine高级模板，Step by Step理论配合实践讲解高级模板制作\n \n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n 可以一笔带过\n \n \n 模板名字\n 模板名字\n \n \n \n \n \n \n \n \n 可以建议直接采用淘宝提供的布局,布局具体可以参见：\nhttp://wiki.zx.taobao.com/index.php/DOM%E3%80%81CSS%E8%A7%84%E8%8C%83#.E5.B8.83.E5.B1.80\n 可以建议直接采用淘宝提供的布局,布局具体可以参见：\nhttp://wiki.zx.taobao.com/index.php/DOM%E3%80%81CSS%E8%A7%84%E8%8C%83#.E5.B8.83.E5.B1.80\n 1. 放坑的意义\n2. 坑的放法\n 1. 放坑的意义\n2. 坑的放法\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 可以说明一些重要的规范即可\n\n 1. 截取了部分global.css代码，说明之前那些规范即可\n 1. 截取了部分global.css代码，说明之前那些规范即可\n 1. 私有系统模块（Private System Module, PSM）\n2. 公共系统模块（Public System Module, PBSM）\n3. 用户模块（User Module, UM）\n 1. 私有系统模块（Private System Module, PSM）\n2. 公共系统模块（Public System Module, PBSM）\n3. 用户模块（User Module, UM）\n 1. 私有系统模块（Private System Module, PSM）\n2. 公共系统模块（Public System Module, PBSM）\n3. 用户模块（User Module, UM）\n 1. 私有系统模块（Private System Module, PSM）\n2. 公共系统模块（Public System Module, PBSM）\n3. 用户模块（User Module, UM）\n 1. 私有系统模块（Private System Module, PSM）\n2. 公共系统模块（Public System Module, PBSM）\n3. 用户模块（User Module, UM）\n 1. 代码片段说明如何添加模块\n2. 代码和实例的页面相对应说\n 1. 代码片段说明如何添加模块\n2. 代码和实例的页面相对应说\n 1. 代码片段说明如何添加模块\n2. 代码和实例的页面相对应说\n 对于PBSM,只需也只能定义CSS来定义样式\n 对于PBSM,只需也只能定义CSS来定义样式\n 1. 如何定义toolbar\n2. 如何获取配置文件参数\n3. 详细参见：http://wiki.zx.taobao.com/index.php/DOM%E3%80%81CSS%E8%A7%84%E8%8C%83#.E6.A8.A1.E5.9D.97\n 1. 如何定义toolbar\n2. 如何获取配置文件参数\n3. 详细参见：http://wiki.zx.taobao.com/index.php/DOM%E3%80%81CSS%E8%A7%84%E8%8C%83#.E6.A8.A1.E5.9D.97\n 1. 如何定义toolbar\n2. 如何获取配置文件参数\n3. 详细参见：http://wiki.zx.taobao.com/index.php/DOM%E3%80%81CSS%E8%A7%84%E8%8C%83#.E6.A8.A1.E5.9D.97\n 1. 如何定义toolbar\n2. 如何获取配置文件参数\n3. 详细参见：http://wiki.zx.taobao.com/index.php/DOM%E3%80%81CSS%E8%A7%84%E8%8C%83#.E6.A8.A1.E5.9D.97\n 1. 如何定义toolbar\n2. 如何获取配置文件参数\n3. 详细参见：http://wiki.zx.taobao.com/index.php/DOM%E3%80%81CSS%E8%A7%84%E8%8C%83#.E6.A8.A1.E5.9D.97\n 配置文件的参数，类型：http://wiki.zx.taobao.com/index.php/%E6%A8%A1%E5%9D%97%E7%BC%96%E5%86%99%E8%A7%84%E8%8C%83#.E6.A8.A1.E5.9D.97.E9.85.8D.E7.BD.AE.E8.AF.B4.E6.98.8E\n 配置文件的参数，类型：http://wiki.zx.taobao.com/index.php/%E6%A8%A1%E5%9D%97%E7%BC%96%E5%86%99%E8%A7%84%E8%8C%83#.E6.A8.A1.E5.9D.97.E9.85.8D.E7.BD.AE.E8.AF.B4.E6.98.8E\n 可以拿着页面上的widget ui做说明\n \n \n \n \n \n 1. 不同widget所需的dom不同，具体参见：http://wiki.zx.taobao.com/index.php/Widget%E8%A7%84%E8%8C%83#Tabs_-_.E6.A0.87.E7.AD.BE.E9.A1.B5\n 1. 不同widget所需的dom不同，具体参见：http://wiki.zx.taobao.com/index.php/Widget%E8%A7%84%E8%8C%83#Tabs_-_.E6.A0.87.E7.AD.BE.E9.A1.B5\n 1. 不同widget所需的dom不同，具体参见：http://wiki.zx.taobao.com/index.php/Widget%E8%A7%84%E8%8C%83#Tabs_-_.E6.A0.87.E7.AD.BE.E9.A1.B5\n \n
