第12章用CSS设置表格和表单样式

网页制作综合技术教程第3部分CSS样式设计第12章用CSS设置表格和表单样式控制表格12.1美化表格12.2案例——日历12.3CSS与表单12.4案例——网上调查问卷12.5表格是网页上很常见的元素。在传统的网页设计中表格除了显示数据外，还常常被用来作为整个页面布局的手段。在Web标准逐渐深入设计领域以后，表格逐渐不再承担布局的任务，但是表格仍然在网页设计中发挥着重要的作用。本章将继续挖掘CSS中表格、表单的强大功能，此外，本章还将介绍表单样式的设置方法。12.1控制表格12.1.1设置表格的边框图12.1基本的表格样式图12.2设置表格的框线1．设置单元格的边框2．相邻边框的合并规则3．边框的分离12.1.2确定表格的宽度12.1.3其他与表格相关的标记ththththtr/trtheadthtdtdtdtr/trtbodythtdtdtdtr/trthtdtdtdtr/tr/thead/tbodyththththtr/trtfoot/tfoottable/table图12.6表格的HTML结构示意12.2美化表格图12.7交替变色的表格样式12.3案例——日历图12.13视图模式显示的日历12.4CSS与表单表单是网页与用户交互所不可缺少的元素，在传统的HTML中对表单元素的样式进行控制的标记很少，仅仅局限于功能上的实现。本节围绕CSS控制表单进行详细介绍，包括表单中各个元素的控制，与表格配合制作各种效果等。12.4.1表单中的元素图12.18普通表单图12.19简单的CSS样式风格12.4.2多彩的下拉菜单图12.21七彩的下拉菜单图12.22最终效果12.5案例——网上调查问卷图12.25外层表格