html+css+javascript 标准教程(第二版)
本书编委会 编著
html+css+javascript 标准教程(第二版)
第23章 综合案例 章
23.1 HTML综合案例 综合案例 23.2 CSS综合案例 综合案例 23.3 网站开发流程 23.4 大综合案例
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1 HTML综合案例 综合案例
23.1.1 本例的设计流程第 23 章
23.1.2 准备素材 23.1.3 网页头部 23.1.4 网页主体
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.1 本例的设计流程
设计好网页效果图,准备好素材(图片,文档第 23 章
等); 按照效果图用HTML实现页面布局; 将素材放到网页中,并添加链接或别的功能; 边做边预览效果,即时修改.
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.2 准备素材
(1)先用Photoshop将网页所有的内容设第 23 章
计好这一步需要前期需求分析,并有大 量的美工设计.
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.2 准备素材
(1)先用Photoshop将网页所有的内容设第 23 章
计好这一步需要前期需求分析,并有大 量的美工设计.
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.2 准备素材
第 23 章
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.2 准备素材
(2)单击Photoshop工具箱最下面的"转到第 23 章
ImageReady"按钮,在ImageReady中用切 片工具将网页分成一个个小块,如图23-4所 23-4 示.切分的原则是将按钮或图片完整地切出 来,如果图片太大,比如横幅Bannezr,可 切分成若干小图.HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.2 准备素材
第 23 章
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.2 准备素材
第 23 章
(3)切分好后,从菜单选择"文件\将优 化结果存储为",如图23-5所示,将图 片导出后的结果如图23-6所示,被切分 的小图片全部被存放到一个文件夹下.
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.2 准备素材
第 23 章
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.2 准备素材
第 23 章
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.3 网页头部
第 23 章
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.1.4 网页主体
第 23 章
1.规划布局 . 2.添加Banner图片 .添加 图片 3.添加主要链接 . 4.比较复杂的表格嵌套的处理 .
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.2 CSS综合案例 综合案例
第 23 章
23.2.1 23.2.2 23.2.3 23.2.4 23.2.5 23.2.6 23.2.7
本案例的设计思路 分析效果图 裁切图片 提取尺寸 规划布局 编写CSS样式文件 编写 样式文件 插入图片和调整内容
HTML/CSS/JavaScript 标准教程实例版(第2版)
html+css+javascript 标准教程(第二版)
23.2.1 本案例的设计思路
第一步分析效果图第 23 章
第二步裁切素材图片 第三步提取尺寸 第四步规划布局 第五步编写CSS样式文件 第六步插入图片和调整内容HTML/CSS/JavaScript 标准教程实例版(第2版)