表格应用场景：数据展示

HTML表格

一 表格<table>

<table>
    <tr>    /*行*/
       <td>...</td>  /*单元格*/
       <td>...</td>
       ......
    </tr>
    ......
    <tr>
       <td>...</td>
       <td>...</td>
       ......
    </tr>
</table>

HTML表单

一、表单标签

image.png

二、 <input>标签

1534493261(1).png

①文件域file

用于上传文件，可从本机存储盘中选择文件

②单选框

name=" " 值应相同。使用checked 设置初始选中选项

③image 图像域——设置图像提交按钮

<input type="image" name="..." src="图像的路径" />

和submit提交按钮一个的作用

④hidden隐藏域

<input type="hidden" name=".." value="..." />

当有些信息不想被用户看到，但又要传递给服务器的时候。

三、下拉菜单和列表项<select>和<option>

<select>
     <option value="...">选项</option>
     <option value="...">选项</option>
</select>

<select name="..." size="..." multiple>
size：设置列表中可见选项的数目
multiple：设置可选择多个选项
设置为下拉菜单时，不添加size和multiple属性，
设置为列表菜单时，需添加size和multiple属性。

四、多行文本域<textarea>

<textarea name=".." rows="行" cols="列" placeholder="提示信息" >
        内容
</textarea>

五、<form>标签

<form action=".." method=".." name=".."   >
       表单元素
</form>

image.png
①action="名字.php"：指向服务器的处理数据的一个程序 .php 后台文件
②method
1）get方法：输入的表单信息将显示在url地址后面，对所发送的信息的数量有限制，一般用于信息的获取，保密性差。
2）post方法：表单数据作为HTTP请求体的一部分，整体打包发送，对所发信息的数量无限制，一般用于修改服务器上的资源，有一定的保密性。
③target：决定打开url的方式
④enctype：multipart/form-data——不对字符进行编码，表单页面包含上传控件使需使用。