HTML5+CSS3网页设计与制作实用教程单元6 模板应用与制作商品推荐页面.pptx

; 通常在一个网站中会有大量风格基本相似的页面，如果逐页创建和修改，既费时又费力，而且效率不高，整个网站中的网页很难做到有统一的外观及结构。为了避免重复劳动，可以使用Dreamweaver CC 提供的模板和库功能，将具有相同版面结构的页面制作成模板，再通过模板来创建其他页面。也可以将相同的页面元素制作成库项目，并存储在库文件中以便随时调用。;;任务 6-1 设计与制作电脑版商品推荐页面0601.html;;;;【任务6-1-1】规划与设计商品推荐页面的布局结构;【任务6-1-1】规划与设计商品推荐页面的布局结构;【任务6-1-1】规划与设计商品推荐页面的布局结构;【任务6-1-1】规划与设计商品推荐页面的布局结构;【任务6-1-1】规划与设计商品推荐页面的布局结构;【任务6-1-1】规划与设计商品推荐页面的布局结构;;;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;【任务6-1-2】制作用于生成网页模板的网页0601.html;;;任务 6-2 制作基于模板的电脑版商品推荐页面0602.html;;;;;;;;;;;;;;;;;【任务6-2-1】基于网页0601.html创建网页模板0602.dwt;;;;;;;;;;;;;【任务6-2-3】在网页0602.html中插入库项目和代码片段;;;【任务6-2-3】在网页0602.html中插入库项目和代码片段;;;【任务6-2-3】在网页0602.html中插入库项目和代码片段;;;【任务6-2-3】在网页0602.html中插入库项目和代码片段;;;任务 6-3 设计与制作触屏版商品促销页面0603.html;表6-9　网页0603.html 中样式文件base.css 的CSS 代码; 在文件夹“CSS”中创建样式文件main.css，并在该样式文件中编写样式代码，为了明确便于区分网页中顶部导航按钮、中部主体内容和底部导航，对样式文件main.css 中的CSS代码分别说明如下，网页0603.html 中顶部导航按钮对应的CSS 代码如表6-10 所示。;任务 6-3 设计与制作触屏版商品促销页面0603.html;任务 6-3 设计与制作触屏版商品促销页面0603.html;网页0603.html 中部主体内容对应的CSS 代码如表6-11 所示。;3．创建主体样式文件main.css;3．创建主体样式文件main.css;网页0603.html 中底部导航对应的CSS 代码如表6-12 所示。;3．创建主体样式文件main.css;3．创建主体样式文件main.css;3．创建主体样式文件main.css;; 在网页文档0603.html 中输入所需的HTML 标签、文字与插入图片，顶部导航按钮对应HTML 代码如表6-14 所示。;网页0603.html 中部主体内容对应的HTML 代码如表6-15 所示。;6．输入HTML标签、文字与插入图片; 网页0602.html 中底部导航按钮和版权信息对应的HTML 代码如表6-16 所示。;;;;;;;;;