表单就是可以让用户填写的表格,你可以创建一个表单向用户收集一些内容,在以后学习 css 的时候,我们可以为表单添加样式 .. 学习 JavaScript 的时候,我们可以为表单添加一些交互的功能 .. 在学习创建应用的时候,可以为表单添加一个用来存储表单数据用的后台 .. 不过在这之前,我们需要了解一下,怎么样去创建一个基本的,没什么样式,也没什么功能的表单 ...
一个表单可以先用一组 form 标签 .. form 的意思就是表单 .. 在它里面可以添加一些表单项目 .. 比如文本框,文本的区域,选择列表,按钮等等 ...
先添加一个最常用的文本框 .. 用的是 input 元素, input 有输入的意思 .. 一个文本框的上面需要再加上一个 type 属性,把它的值设置成 text .. 意思就是这个 input 元素是一个文本框 ..
除了 text, input 元素的 type 属性的值还可以是 date,email,file,url 等等 ...
在这个 input 元素里面再添加一个 placeholder .. 表示占位符 .. 它的值可以显示在这个文本框的里面 .. 提示用户在这个文本框里应该输入的东西 ..
文本框里的值可以放到 value 属性里面 ... 这样用户可以编辑这个文本框里的内容 .. 使用 label 标签,我们可以给表单项目添加一个标签,描述一下这个表单项目是做什么的 ..
输入一组 label .. 里面是标签内容 .. 我们可以使用这个 label 包装一下表单项目 .. 这样就表示这个标签是为它包装的表单项目准备的 .. 或者也可以这样 .. 在这个表单项目上添加一个 id 属性,给它添加一个 id 号 .. 其实就相当于是为这个表单项目起了一个名字 ..
在注意在同一个页面上元素不能使用同样的名字 .. 也就是这个 input 元素的 id 属性的值是 username ,那其它的元素里面的 id 属性就不能使用这个 username 了 ..
然后在 label 标签里面添加一个 for 属性 .. 它的值是这个标签表示的那个表单元素上的 id 号 .. 这里就是 username .. 这样就不需要使用这个 label 标签包装下面这个 input 元素了 ..
一般一个表单里都会有一个提交表单用的按钮 .. 按钮可以使用一个 button 元素 .. 先输入一组 button 标签 .. 它里面包装的是按钮上面要显示的文字 ..
另外我们需要再设置一下这个按钮的类型,在这个 button 标签上添加一个 type 属性 .. 它的值可以是 reset .. 表示重置用的按钮 .. 或者 submit .. 提交表单用的按钮 .. 也可以是 button ,也就是没有默认功能的按钮 ..
这里我们把它的值设置成 submit ..