HTML 表单的用法

form的简介

表单是可以搜集不同类型的用户输入，并通过浏览器将这些数据传送到服务器端，实现网站与用户之间的信息交互。

form的属性

• action：指定表单数据提交到哪个地址进行处理
• method：指明提交表单的HTTP方法，取值为get或post
• target：在何处打开action，与标签的target属性用法类似。
• enctype（编码方式）：

1. application/x-www-form-urlencoded：在发送前编码所有字符（默认）
2. text/plain：空格转换为 "+" 加号，但不对特殊字符编码
3. multipart/form-data：使用包含文件上传控件的表单时，必须使用该值

eg.

.....

常用标签

input标签	作用
	文本输入框，单行，默认宽度为20个字符
	密码输入框，输入内容自动转变成圆点
	单选框，用name分组要一致，一定要加value值
	复选框，用name分组要一致，一定要加value值
	文件上传，accept属性值可限制上传文件类型
	隐藏字段，后台可根据name、value值判断用户提交的表单数据是否安全
	定义按钮
	定义提交表单数据至表单处理程序的按钮
	定义重置按钮
	定义图像形式的提交按钮

eg.

  

     账户: 
    
  
  

     密码: 
    
  
 
  

    
    
  
  

     性别: 
    男
    女
  
  

     爱好: 
    读书
    跑步
    唱歌
    跳舞
  
  

     设置头像: 
    
    
  
 

显示效果：

input.png

• textarea标签：多行文本输入

    在这里输入内容...
    
    

显示效果：

textarea.png

• select标签：下拉菜单

  职业：
   
      老师
      医生
      律师
      学生
      程序猿
      
   

显示效果：

select.png

• label标签&placeholder属性：

 
 
    姓名： 
     
    
 
 

   密码：
   
  

显示效果：

label&placeholder.png

说明：

1. 如果在 label 标签内点击文本，就会触发此控件。就是说，当用户单击选中该label标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。
   ==大白话：点击“密码”或输入框均可输入密码==
2. placeholder是提示文字，当用户在文本框里输入了什么信息，提示信息就会隐藏