表格模板-第8章用CSS设置表格和表单样式 精品.ppt

《表格模板-第8章用CSS设置表格和表单样式 精品.ppt》由会员分享，可在线阅读，更多相关《表格模板-第8章用CSS设置表格和表单样式 精品.ppt（22页珍藏版）》请在第一文库网上搜索。

1、CSSCSS网页设计标准教程网页设计标准教程第第2 2部分部分 CSSCSS专题技术专题技术 控制表格控制表格8.1美化表格美化表格8.2制作日历制作日历8.3CSS与表单与表单8.4网民调查问卷实例网民调查问卷实例8.5 表格是网页上很常见的元素。表格是网页上很常见的元素。 在传统的网页设计中表格除了显示数在传统的网页设计中表格除了显示数据外，还常常被用来作为整个页面布局的据外，还常常被用来作为整个页面布局的手段。手段。 在在WebWeb标准逐渐深入设计领域以后，表标准逐渐深入设计领域以后，表格逐渐不再承担布局的任务，但是表格仍格逐渐不再承担布局的任务，但是表格仍然都在网页设计中发挥着重要的

2、作用。然都在网页设计中发挥着重要的作用。 本章介绍表格与表单样式的设置方法。本章介绍表格与表单样式的设置方法。8.1 8.1 控控 制制 表表 格格 8.1.1 8.1.1 设置表格的边框设置表格的边框 图图8.1 基本的表格样式基本的表格样式 图图8.2 设置表格的框线设置表格的框线 1 1设置单元格的边框设置单元格的边框2 2相邻边框的合并规则相邻边框的合并规则3 3边框的分离边框的分离 8.1.2 8.1.2 确定表格的宽度确定表格的宽度 8.1.3 8.1.3 其他与表格相关的标记其他与表格相关的标记 图图8.6 表格的表格的HTML结构示意结构示意8.2 8.2 美美 化化 表表 格

3、格图图8.7 交替变色的表格样式交替变色的表格样式 8.2.1 8.2.1 搭建搭建HTMLHTML结构结构 8.2.2 8.2.2 整体设置整体设置 8.2.3 8.2.3 设置单元格样式设置单元格样式 8.2.4 8.2.4 斑马纹效果斑马纹效果8.3 8.3 制制 作作 日日 历历图图8.12 Google日历日历 图图8.13 中视图模式显示的日历中视图模式显示的日历 8.3.1 8.3.1 搭建搭建HTMLHTML结构结构8.3.2 8.3.2 设置整体样式和表头样式设置整体样式和表头样式8.3.3 8.3.3 设置日历单元格样式设置日历单元格样式8.4 CSS8.4 CSS与表单与表单 8.4.1 8.4.1 表单中的元素表单中的元素 图图8.18 普通表单普通表单 图图8.19 简单的简单的CSS样式风格样式风格8.4.2 8.4.2 多彩的下拉菜单多彩的下拉菜单图图8.21 七彩的下拉菜单七彩的下拉菜单 图图8.22 最终效果最终效果8.5 8.5 网民调查问卷实例网民调查问卷实例图图8.23 调查问卷调查问卷