1+X考试课程（二）HTML表单

表格

创建表格

    ...
  
  ...

  

    
单元格内的文字

标签	作用
<table>

用于定义一个表格 定义表格中的一行 单元格（表格中的列）

注意：
1.tr中只能嵌套td。
2.td下可以有任意元素。

表格属性

属性名	含义	常用属性值
border	设置表格的边框（默认border="0"无边框）	像素值
cellspacing	设置单元格与单元格边框之间的空白间距	像素值（默认2像素）
cellpadding	设置单元格内容与单元格边框之间的空白间距	像素值
width	设置表格的宽度	像素值
height	设置表格的高度	像素值
align	设置表格在网页中的水平对齐方式	left、center、right

表格结构

：头部，必须位于

中，一般包含网页的logo和导航等头部信息。
：主体。

    

    

        
标题111
        
标题222
        
标题333
    
    
    

    

        
内容111
        
内容222
        
内容333
    
    
    

    

        
内容111
        
内容222
        
内容333
    
    

表格标题

   
标题

caption标签必须紧随table标签之后，每个表格只能定义一个标题，且居中于表格之上。

合并单元格

代码：
完整样式

    

        
1
        
2
        
3
    
    

        
4
        
5
        
6
    

跨列合并

    

        
1
        
colspan跨列合并
    
    

        
4
        
5
        
6
    

跨行合并

    

        
1
        
2
        
rowspan跨行合并
    
    

        
4
        
5
    

思想：多个内容合并时，将多余的东西删除。

公式：删除的个数 = 合并的个数 - 1。

合并的顺序：先上、先左。

总结

1.表格提供了HTML中定义表格式数据的方法。

2.表格中由 行 中的单元格组成。

3.表格中没有列元素，列的个数取决于行的单元格个数。

表单

完整表单通常由：表单控件 、提示信息 、表单域 三个部分构成。

表单控件：包含了具体的表单功能项。

提示信息：说明性文字，提示用户进行填写和操作。

表单域：容纳所有的表单控件和提示信息，定义处理表单数据所有程序的url地址，以及数据提交到服务器的方法。

input控件

属性	属性值	描述
type	text	单行文本输入框
	password	密码输入框
	radio	单选按钮
	checkbox	复选框
	button	普通按钮
	submit	提交按钮
	reset	重置按钮
	image	图像形式的提交按钮
	file	文件域
name	由用户自定义	控件的名称
value	由用户自定义	input控件中的默认文本值
size	正整数	input控件在页面中的显示宽度
checked	checked	定义选择控件默认被选中的项
maxlength	正整数	控件允许输入的最多字符数

label标签

作用：用于绑定一个表单元素，当点击label标签的时候，被绑定的表单元素就会获得输入焦点。

用户名：

通过 id 绑定表单元素。

textarea标签

需要输入大量的信息时，textarea控件创建多行文本输入框。

例子

    哈哈哈哈哈啊哈哈啊哈哈哈哈哈啊哈哈哈哈哈哈哈哈啊哈哈哈哈啊哈哈哈哈啊哈哈哈哈哈哈哈哈啊哈哈哈哈啊哈哈哈哈哈哈哈啊哈哈哈哈啊哈哈哈哈哈哈哈啊哈哈哈哈哈

结果

一个汉字 = 两个字符。

下拉菜单

    选项一
    选项二
    选项三

例子

    哈哈
    嘿嘿
    吼吼

结果

注意：
1.中必须含有一对。
2.在option中定义selected="selected"时，当前选项为默认选中项。

表单域

在HTML中，form标签被用于定义表单域，即创建一个表单，来实现用户信息的收集和传递。

各种表单控件

常用属性	作用
action	指定接收并处理表单数据的服务器程序的url地址
method	设置表单数据的提交方式，取值为get或post
name	指定表单的名称，以区分同一个页面中的多个表单