## 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>