form 表单

form表单用于收集填写的信息,提交后台,表单的元素用form包括所有的元素,形成完整的数据。

form表单常见标签的使用注意事项:

  • 一般常用的标签有form、name、lable、text、button、input、textarea、checkbox、radio、select、password、placeholder、file、hidden。
    其中form作为表单的开始和结束标签
    name值为什么,传递的就是什么,必须得有,才能传递数值后台
    lable一般用于解释性语句,输入框旁边的内容,做提示用
    placeholder提示用
    text一般是单行文本内容<input type="text">
    textarea是多行文本,标签需要闭合<textarea>...</textarea>
    checkbox复选框,可多选<input type="checkbox">
    select下拉菜单,标签需要闭合,与option搭配使用<select><option>...</option></select>
    file上传文件<input type="file">
    hidden为了安全性<input type="hidden">
    如:
<form action="" method="post">
  <div>
    <lable>姓名:</lable>
    <input type="text" name="username" value="" placeholder="用户名">
  </div>
  <div>
    <lable>密码:</lable>
    <input type="password" name="password" value="123456" >
  </div>
  <div>
    <lable>性别:</lable>
    <input type="radio" name="sex" value="men" checked="cehcked">男
    <input type="radio" name="sex" value="women">女
  </div>
  <div>
    <lable>我的爱好:</lable>
    <input type="checkbox" name="myhobby" value="dota">dota 
    <input type="checkbox" name="myhobby" value="trvale" checked="cehcked">旅游
     <input type="checkbox" name="myhobby" value="pet" checked="cehcked">宠物
  </div>
  <div>
    <lable>评论:</lable>
    <textarea name="commnet" cols="60" rows="10">
    </textarea>
  </div>
  <div>
    <lable>我梦想的car:</lable>
    <select>
      <option>兰博基尼</option>
       <option>玛莎拉蒂</option>
    </select>
  </div>
  <div>
    <input type="hidden" name="123456" value="阿拉丁神灯">
  </div>
<div>
    <input type="file" accept="image/png">
  </div>
 <div>
    <button>普通按钮</button>
    <input type="button" name="button" value="提交">
    <input type="button" name="reset"  value="重置">
  </div>
  </form>
form表单的简单应用
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • form简介 是HTML中的一个元素,它表示文档中的一个区域,这个区域包含了交互控件,用于向web服务器提交信息。...
    七里之境阅读 5,169评论 0 1
  • 一.什么是< form>表单 格式: 作用:form表单一般用来收集用户的信息,并把信息传送到后台。 注意点:1....
    饥人谷_刘冲阅读 7,743评论 0 1
  • 本人做php的,最近发现JS真的是博大精深啊,比PHP难.在HTML中,表单是由form元素来表示的,但是在jav...
    linfree阅读 6,609评论 3 17
  • 1.form表单有什么作用?有哪些常用的input 标签,分别有什么作用? HTML 表单用于接收不同类型的用户输...
    大胡子歌歌阅读 4,400评论 0 1
  • form表单有什么作用?有哪些常用的input 标签,分别有什么作用? 作用:form表单提交的方式向服务器发送数...
    姚小帅阅读 4,239评论 0 0