from和inpu的用法介绍（Mac实操版）

Mac版写HTML与Windows版不同但思路不变。首先创建HTML文件 通过快捷键commandspace 搜索“文本编辑”App。接下来点击新建文稿将文稿重命名改为html后缀结尾如下图所示通过选择VScode的打开方式就可以进行网页的编写啦想要把网页渲染效果如下图首先要了解from标签的常用属性name属性表单的名字在一个网页中用于唯一识别一个表单。action属性表单处理方式简单来说就是提交到哪里往往是E-mail地址或网址。method属性表单数据提交方式常用的有GET和POSTGet 查数据POST 传数据除了表单的属性还需要了解表单元素。表单是一个容器可以存放各种表单元素如按钮、文本域等等。常见表单元素如下input该标签用来定义用户可输入数据的输入字段根据不同type属性输入字段可以是文本字段、密码字段、复选框、单选按钮、按钮、文件、图像等等。其语法格式为input type:表项类型 name表项名 value默认值sizex maxlengthy/input元素中常用属性如下type指定加入表单项目的类型text、password、checkbox、radio、button、file、 submit、reset等name该表项的控制名主要在处理表单上起作用output该标签用来定义不同类型的输出keygen该标签用于表单的密钥对生成器字段object该标签用来定义一个嵌入的对象select该标签用来定义下拉列表/表单textarea该标签用来定义一个多行的文本输入区域知道这些我们就可以开始编写网页了代码如下xform action# methodGET账号input typetext name账号br!--若type“password空格”则密码明文显示--密码input typepassword name密码br!--定义单选按钮时同一组中的选项必须指定相同name“单选”才生效--爱好篮球input typecheckbox name爱好 value篮球唱歌input typecheckbox name爱好 value唱歌性别男input typeradio name性别 value男女input typeradio name性别 value女input typereset value重置input typesubmit value提交input typebutton value其他普通按钮/form渲染效果如图注意checkbox为复选框可以进行多选。radio为单选框只能单选。因此上面编写的表单中“爱好”项是可以多选的“性别”项目只能单选通过这个方法在网页填写的表单按“提交”后自动在网页地址栏呈现如下图第二种方式是提交到API代码如下h2实验2:提交到测试API/h2!--【from标签的常用属性说明】action提交到哪里method提交方式常用的有GET和POSTGET 查数据POST 传数据target“_blank” 提交后在新标签页打开结果不覆盖当前表单页面enctype“multipart/from-data”表单包含文件上传时必须加此编码格式无文件上传时不需要加--formactionhttps://httpbin.org/postmethodPOSTtarget_blankenctypemultipart/form-data账号input typetext name账号br密码input typepassword name密码br爱好篮球input typecheckbox name爱好 value篮球唱歌input typecheckbox name爱好 value唱歌性别男input typeradio name性别 value男女input typeradio name性别 value女身份证照片input typefile value上传你的身份证照片 name身份证照片brinput typereset value重置input typesubmit value提交/form效果如下