HTML与CSS教学-第十章 对表格与表单应用CSS样式

 

第十章 对表格与表单应用CSS样式
本章要点
如何利用CSS样式构建美观的数据表格
CSS样式在表单中的应用
目录：
10.1  利用CSS样式构建美观的数据表格
10.2  CSS样式在表单中的应用

10.1  利用CSS样式构建美观的数据表格
1. 表格标记
（1） 有关标记
包括：
<table>，<td>，<caption> ，<thead>，<tbody>，<tfood> ，<col>，<colgroup> 等。
（2）表格中常用的属性
包括：
边框宽度、边框颜色、边框样式 、边框属性、填充间距 、宽度 、高度 、边框共享等。

2.对表格应用样式
包括可以进行下面的一些设置：
（1）表格和单元格宽度
（2）文本对齐
（3）边框
（4）边距设置
（5）背景设置
（6）标题和表头的处理
（8）标题摆放
（9）表格行的颜色交替
（10）不完全表格
（11）内部表格
（12）按列进行设置
（13）鼠标动态效果

10.2  CSS样式在表单中的应用 
1. 表单标记
包括：
<form >，<input >，<fieldset > ，<legend >，<label >等。
2.表单布局 
包括可以进行下面的一些设置：
（1）格式对齐
（2）标签和输入框分两行显示
（3）增加排序 

3. 修饰表单
 在给表单布局后，需要对表单的字体，颜色，边距等外观进行设置，使整个表单看起来更友好。
包括可以进行下面的一些设置：
（1）设置<fieldset>
（2）设置标题
（3）设置强调信息
（4）设置提示信息
（5）强调输入框
（6）输入框和按钮的特殊效果

4. 复杂的表单布局
对于比较长和复杂的表单，表单上不仅有文本输入框，还会有单选框、下拉列表等。这个时候在布局的时候要考虑到各种元素的整体排放了。
包括可以进行下面的一些设置：
（1）表单控件分组设置样式
（2）隐藏部分标签