表格<table>属性
border：设置表格边框（默认border="0"为无边框）。cellspacing：设置单元格与单元格之间的距离。cellpadding：设置单元格内容与单元格边框之间的距离。
<table>
<tr>
<td>学号</td>
<td>姓名</td>
<td>性别</td>
</tr>
<tr>
<td>2024001</td>
<td>李四</td>
<td>男</td>
</tr>
</table>
width：设置表格的宽度。height：设置表格的高度。align：设置表格的对齐方式（left左对齐、center居中、right右对齐）。bgcolor：设置表格的背景颜色。background：设置表格的背景图片。
行<tr>属性
height：设置行的高度。align：设置一行内容的水平对齐方式（left、center、right）。valign：设置一行内容的垂直对齐方式（top上、center居中、bottom下）。bgcolor：设置行的背景颜色。background：设置行的背景图片。
<td>属性
- width - 设置单元格的宽度
- height - 设置单元格的高度
- align - 设置单元格内容的水平对齐方式
- left（左）
- center（中）
- right（右）
- valign - 设置单元格内容的垂直对齐方式
- top（上）
- center（中）
- bottom（下）
- bgcolor - 设置单元格的背景颜色
- background - 设置单元格的背景图片
- colspan - 设置单元格横跨的列数
- rowspan - 设置单元格横跨的行数
表单<form>
作用
在网页中与用户进行交互，收集用户资料，实现网页（用户）和后端的数据交互。
组成
一个完整的表单通常由三个部分组成：
- 表单域 - 包含表单元素的区域
- 提示信息 - 说明性的文字
- 表单控件 - 各种输入字段
表单域 <form>
基本语法
<form action="url地址" method="提交方式" name="表单域名标识">
<!-- 各种表单元素 -->
</form>
常用属性
| 属性 | 属性值 | 作用 |
|---|---|---|
| action | url地址 | 指定接收并处理表单数据的服务器程序的url地址 |
| method | get/post | 设置表单数据的提交方式 |
| name | 名称 | 指定表单的名称，区分同一页面中的多个表单域 |
注意
- get方式：表单数据会显示在浏览器地址栏中（明文传递，数据不安全）
- post方式：表单数据不会显示在浏览器地址栏中（密文传递，数据安全）
<input> 输入标签
作用
在<input/标签中，包含一个划Pe属性，根据不同的type属性值，输入字段拥有 很多种形式（可以是文本框，密码框，等等）
<input type="属性值“1>
type属性值
| 属性值 | 描述 |
|---|---|
| text | 单行文本输入框 |
| password | 密码输入框 |
| radio | 单选按钮 |
| checkbox | 复选框 |
| button | 普通按钮 |
| submit | 提交按钮 |
| reset | 重置按钮 |
| image | 图像形式的提交按钮 |
| hidden | 隐藏域 |
| file | 文件域 |
| e-mail 地址的输入域 | |
| url | URL 地址的输入域 |
| number | 数值的输入域 |
| range | 一定范围内数字值的输入域 |
| date/month/week/time/datetime/datetime-local | 日期和时间的输入类型 |
| search | 搜索域 |
| color | 颜色输入类型 |
| tel | 电话号码输入类型 |
案例
<form action="http://www.baidu.com" method="post" name="gerenjianjie">
用户名: <input type="text" name="mizi" /> <br/>
密码: <input type="password" name="mima" value="123" /> <br/>
性别: 男 <input type="radio" name="sex" value="男" />
女 <input type="radio" name="sex" value="女" /> <br />
爱好: <br/>
打羽毛球 <input type="checkbox" name="aihao" value="打羽毛球" />
打游戏 <input type="checkbox" name="aihao" value="打游戏" />
看小说 <input type="checkbox" name="aihao" value="看小说" /> <br/>
<input type="button" value="普通按钮" />
<input type="submit" value="提交按钮" />
<input type="reset" />
<input type="image" src="2.jpg" width="100px" height="100px" />
<input type="file" />
</form>
其他常用属性
| 属性 | 属性值 | 描述 |
|---|---|---|
| name | 用户自定义 | 定义input元素的名称 |
| value | 用户自定义 | 规定input元素的值 |
| checked | checked | 规定此input元素首次加载时应当被选中 |
| maxlength | 正整数 | 规定输入字段中的字符的最大长度 |
注意
- name和value是每个表单元素都有的属性值，主要给后端人员使用
- name是表单元素的名字，要求单选按钮和复选框要有相同的name值
- checked属性主要针对单选按钮和复选框，用于设置默认选中项
- maxlength用于限制表单元素输入的最大字符数
<label> 标签
作用
用于绑定一个表单元素，当点击label标签内的文本时，浏览器会自动将焦点转到对应的表单元素上，提升用户体验。
语法
<label for="sex">男</label>
<input type="radio" name="sex" id="sex">
案例
性别：
<label for="female">女</label>
<input type="radio" name="sex" value="女" checked="checked" id="female">
<label for="male">男</label>
<input type="radio" name="sex" value="男" id="male">
<br/>
注意：label标签的for属性应当与相关元素的id属性相同。
<textarea> 多行文本输入框
语法
<textarea rows="3" cols="20">
文本内容
</textarea>
属性
- cols - 每行中的字符数
- rows - 显示的行数
<select> 下拉菜单
语法
<select>
<option>选项1</option>
<option>选项2</option>
<option>选项3</option>
</select>
注意
<select>中至少包含一对<option>- 在
<option>中定义selected="selected"时，表示当前项为默认选中项
案例
地址：
<select>
<option>北京</option>
<option selected="selected">上海</option>
<option>广州</option>
</select>
<br/>
