HTML标签_表单标签

HTML表单标签

表单：
- 概念：用于采集用户输入的数据的。用于和服务器进行交互。
- 使用的标签：form用于定义表单的，可以定义一个范围，范围代表采集用户数据的范围
  - 属性：
    - action：指定提交数据的URL
    - method：指定提交方式
      - 分类：一共7种，两种比较常用
        
        get:
        1.请求参数会在地址栏中显示
        2.请求参数的大小是有限制的。
        3.不太安全
        
        post:
        1.请求参数的大小没有限制
        2.请求参数不会在地址栏中显示。会封装在请求体中（HTTP协议后讲解）
        3.较为安全
  - 表单项中的数据要想被提交：必须指定name属性

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表单标签</title>
	</head>
	<body>

		 <form action="#" method="get">
			 用户名：<input name="username"/><br/>
			 密码：<input name="password"/><br/>
			 <input type="submit" value="登录" />
		 </form>
	</body>
</html>

表单项标签

表单项标签
- input：可以通过type属性值，改变元素展示的样式
  - type属性：
    - text：文本输入框，默认值
      - laceholder：指定输入框的提示信息，当输入框的内容发生变化，会自动清空提示信息
    - password：密码输入框
    - radio：单选框
      - 注意：
        1.要想让多个单选框实现单选的效果，则多个单选框的name属性值必须一样。
        2.一般会给每一个单选框提供value属性，指定其被选中后提交的值
        3.checkbox属性可以指定默认值
      - checkbox：复选框
        
        注意：
        1.一般会给每一单选框提供value属性，指定其被选中后提交的值
        2.checked属性，可以指定默认值
      - file：文件选择框
      - hidden：隐藏域，用于提交一些信息。
      - 按钮：
        
        submit：提交按钮。
        
        button：普通按钮
        
        image：图片提交按钮
        
        src属性指定图片的路径
    - label：指定输入项的文字描述信息
      * 注意：
      * label的for属性一般会和input的id属性值对应。如果对应了，则点击 label区域，会让input输入框获取焦点。
  - select：下拉列表
    - 子元素：option，指定列表项
  - textarea：文本域
    - cols：指定列数，每一行有多少个字符
    - rows：默认多少行