HTML5+CSS3网页设计与制作实用教程单元5 网页布局与制作商品筛选页面.pptx

; CSS 样式能更加方便有效地布局网页结构、控制网页元素。创建CSS 样式文件，可以实现“创建一次、使用多次”的目的，从而大大提高了网页排版的效率，而且保证网站具有一致的整体风格。 使用HTML+CSS 进行网页布局，能够真正做到Web 标准所要求的网页内容与表现相分离，CSS 代码可以更好地控制元素定位，使用外边距、边框、颜色等属性可以设置格式，从而使网站的维护更加方便和快捷。网页整体的布局结构通常有两列式、三列式和多列式等多种形式。; 两列式网页布局是较常用的网页整体布局方式，例如个人博客网页、电子商务网站经常使用这种布局方式。两列式布局可以使用浮动布局或者层布局实现，实现方式也多种多样。浮动布局可以设计成宽度固定，左、右两列都浮动，也可以使用百分比形式定义列自适应宽度。层布局可以采用绝对定位，把左、右列固定在左右两边。 三列式网页布局也是一种较常用的网页整体布局方式，使网站内容显得非常丰富，能充分利用网页空间。三列式布局相对复杂，可以使用嵌套浮动、并列浮动、并列层等多方式实现，宽度可以定义为固定值或自适应宽度。 多列式网页布局结构较复杂，其实现方法也是多种多样，可以采用嵌套结构、并列浮动结构和列表结构，其实现方法与两列式网页布局和三列式网页布局类似。;;任务 5-1 设计与制作电脑版商品筛选页面0501.html;;;;【任务5-1-1】规划与设计商品筛选页面的布局结构;【任务5-1-1】规划与设计商品筛选页面的布局结构;【任务5-1-1】规划与设计商品筛选页面的布局结构;【任务5-1-1】规划与设计商品筛选页面的布局结构;【任务5-1-1】规划与设计商品筛选页面的布局结构;【任务5-1-1】规划与设计商品筛选页面的布局结构;;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;【任务5-1-2】布局与美化商品筛选页面的左侧列表内容;;;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商???筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;【任务5-1-3】布局与美化商品筛选页面的右侧主体内容;;;;任务 5-2 制作触屏版促销商品页面0502.html;任务 5-2 制作触屏版促销商品页面0502.html;任务 5-2 制作触屏版促销商品页面0502.html;任务 5-2 制作触屏版促销商品页面0502.html;任务 5-2 制作触屏版促销商品页面0502.html;任务 5-2 制作触屏版促销商品页面0502.html;;任务 5-2 制作触屏版促销商品页面0502.html;任务 5-2 制作触屏版促销商品页面0502