HTML 表单的用法

form标签:

表单作用:搜集用户填写的信息,提交给网站后台(即服务器)
属性:

  • action:信息要提交的地址
  • method: 浏览器向后台传输数据的方式:get或者post(区别见上一片文章)
  • target:在何处打开action(用的较少)
  • entype:
    1.application/x-www-form-urlencoded:在发送前编码所有的字符(默认)
    2.text/plain:空格转换为"+"号,但不对特殊字符编码
    3.mutipart/form-data:使用包含文件上传控件的表单时,必须用该值
    表单需要用form标签包围,格式如下:

常见input标签及属性

  • input标签使用type属性的值来规定input元素的类型,常见有以下类型:

常见:

type 作用
text 定义单行输入框,可在其中输入文本
password 密码输入框,输入的内容在页面上以圆点展示
checkbox 定义复选框
radio 定义单选框
file 定义输入字段和“浏览”按钮,供文件上传
hidden 隐藏的标签。可以用来发送默认项或者进行安全校验
button 定义可点击的按钮,不可提交
submit 定义提交按钮,把表单数据发给服务器
reset 定义重置按钮,用于清除表单中的用户输入的数据
image 定义图像形式的提交按钮

非常见:

type 作用
url URL的绝对地址
email 邮件地址
search 无换行的搜索框
tel 无换行的电话号码框
date 日期输入框,可以选择日期
time 时间输入框
number 数字输入框,整数小数都可以
range 范围选择框,0~100
color 选择颜色

select标签

  • 下拉菜单
  • 格式:

注:在option标签中加一个selected表示默认选择

taxtarea标签

  • 一个可以多行输入的文本框
  • 格式:
    

label标签

  • for属性可以与input的id属性配合,点击输入框前的文字时,也能进入focus状态

你可能感兴趣的:(HTML 表单的用法)