## form 表单 * action 表单提交的地址 * method 表单提交的方法 <br> ## 表单控件 * input * textarea * select ... <br> ## input标签 ~~~ <input type="类型" name="这个标签的名字" value="这个表单控件的值" /> ~~~ #### type的值决定input到底是个啥，默认是文本框，如下 * text 文本框 * password 密码 * radio 单选 * checkbox 复选 * submit 提交 * image 图片按钮 * reset 重置 * button 按钮 * file 上传 * hidden 隐藏 * email 电子邮箱文本框 * tel 电话号码 * url 网页的URL * search 搜索引擎 * range 特定范围内的数值选择器 * number 只能包含数字的输入框 * color 颜色选择器 * datetime-local 显示完整日期，不含时区 * time 显示时间，不含时区 * date 显示日期 * week 显示周 * month 显示月 <br> ## label标签 ~~~ <!-- 点击label，input的id如果等于for值，这个input会获取焦点 --> <label for="account">账号:</label><input id="account" type="类型" name="这个标签的名字" value="这个表单控件的值" /> ~~~ <br> ## checkbox - 多选框 ~~~ /* 有checked就打钩 */ <input type="checkbox" checked> ~~~ <br> ## radio - 单选框 ~~~ /* name一样就可以组成一组单选框，只能选一个 */ 男<input type="radio" name="r1" checked> 女<input type="radio" name="r1"> ~~~ <br> ## select标签 <select> <option>手机</option> <option selected="selected">电脑</option> <option>平板</option> </select> <br> <br> ~~~ <select> <option>手机</option> <option selected="selected">电脑</option> <option>平板</option> </select> ~~~ <br> ## textarea标签 文本域 其实就是大型文本框 <br> ## 其他表单元素属性 #### disabled 属性规定应该禁用的表单控件 <br> #### placeholder 输入框提示信息 <br> #### autocomplete 是否保存用户输入值 <br> #### autofocus 指定表单获取输入焦点 <br> #### required 此项必填，不能为空 <br> #### pattern 正则验证 <br> <br> ## 属性选择器 ~~~css /* 选中所有复选框 */ input[type="checkbox"]{ } ~~~ <br> ## 表单相关伪类选择器 #### 选中所有被禁止的input控件 ~~~css input:disabled{ } ~~~ <br> #### 选中所有能用的input控件 ~~~css input:disabled{ } ~~~ <br> #### 选中所有被选中的复选框或者单选框 ~~~css input:disabled{ } ~~~ <br>