html第四天

表单

1.收集数据

2.提交

<form method = “”>

</form>

method = “” 以哪种方式提交 get post

action = “” 提交到某个页面

1.文本输入框

<input type = “text” name = “username” value = “” placeholder = “” autofocus readonly disabled maxlength/>

2.密码输入框

密码:<input type = “password” name = “psd” value = “” placeholder = “密码”/>

3.按钮

1.普通按钮(没有任何功能的按钮)

    <input type = “button” value = “登陆" />

2.提交按钮(有提交的功能)

    <input type = “submit” value = “提交”>

3.重置按钮

<input type = “rest” value = “提交”>

4.单选

<input type = “radio” name = “sex” value = “woman”/>

<input type = “radio” name = “sex” value = “man”/>

<input type = “radio” name = “sex” value = “baomi”>保密

三个选项选择其中一个

⚠️把checked放在单选的选项中，默认选中最后一个(这种写法是不合规矩的)

5.多选

<input type = “checkbox” name = “have” value = “pen”/>

<input type = “checkbox” name = “have” value = “apple”/>

<input type = “checkbox” name = “have” value = “pineapple”/>

单选和多选都有的一个属性

checked  (默认被选中的选项)

---

6.下拉框

例子：省份

<select name = “pro”>

<option value = “安徽">安徽</option>

<option value = “北京” selected>北京</option>

<option value = “上海">上海</option>

<option value = “广东">广东</option>

</select>

属性：selected 默认被选中的；⚠️多个选项添加selected，默认读取最后一个

例子2:省份后还有城市的选项

7.文本域(可输入多行文本)

例子

留言：<textarea placeholder = “留下你想说的话” role = “” cols = “"></textarea>

属性: cols = “” 合并列

          rols = “”  合并行

         用于设置宽高

8.文件上传

<input type = “file” name = “pictrue” value = “” multiple/>

属性：

multiple:支持多文件上传

9.表单控件

点击文本，文本框自动获取光标

两种写法

---