表单及表格

表单介绍

表单的概念: 表单是用来收集用户的信息或是数据

1、提交按钮、重置按钮、普通按钮

2、单选框、复选框

    

        
        单选A 

        单选B 

        单选C 

        
        多选A             

        多选B             

        多选C             

        
    

3、文本框、密码框

4、下拉框

    
    
        下拉A
        下拉B
        下拉C
        下拉D
           

5、文本域

表格介绍

    

    
表格标题
        

            

            

        
    
    

【table的常用属性】

1-border：表格边框属性；当使用border="1"设置边框时，会在所有td以及table上嵌套边框，当border加大时，只有table框会加粗。

2-cellspacing：单元格与单元格之间的间隙。当cellspacing="0"时，单元格之间的间隙为0，但边框线并不会合并。

☆☆合并边框的写法style=“border-collapse:collapse;” 使用边框合并时，无需设置cellspacing。

3-cellpadding:单元格内边距，单元格中文字与单元格边框之间的距离。

4-width/height:表格的宽高

5-align：设置表格在父容器中的对齐方式 ，left/居左 center/居中 right/居右

☆☆当表格使用align属性时，相当于使表格浮动，可能会导致表格后面的元素受表格浮动影响，导致布局错乱。

6-bgcolor：背景色

7-background：背景图，后接相对路径。背景图和背景色同时生效时，图会覆盖背景色

8-bordercolor：设置边框颜色

【tr、td标签的属性】

当表格属性与行列属性冲突时，以行列属性为优先，属性设置优先级td>tr>table。

1-width,height:给单个的行列设置宽高

2-bgcolor:背景色

3-align：设置单元格中的文字，在单元格中的水平对齐方式 left/center/right

4-valign:设置单元格中文字在格中的垂直对齐方式 top/center/bottom

5-nowrap:nowrap="nowrap"设置单元格文字行末不断行

【表格的跨行与跨列】

1-跨列：colspan，某单元格跨N列，则该单元格右边的N-1个td就不需要了。

2-跨行：rowspan，某单元格跨N行，则该单元格下边的N-1个td就不需要了。