HTML Day3
*****From****
表單:
<form name="test" method="get" action="https://www.google.com"></from>
from 表單 用於提供使用者輸入資訊並提交給server
輸入密碼欄:
password:<input type="password" placeholder="六位數密碼" >
表籤input type 設定為password key資訊則為隱藏
*****單選按鈕*****
<input type="radio" name="sex" checked="checked">男
<input type="radio" name="sex">女
type 設定為 radio 則為單選鈕
name 設定相同 在單選鈕中相同的name 只能選擇一個
checked="checked"設定為默認項
*****複選按鈕*****
<input type="checkbox" name="like" />睡覺
<input type="checkbox" name="like" checked="checked" />吃飯
<input type="checkbox" name="like" />打豆豆
type 設定為 checkbox則為複選鈕
name 設定相同 在複選鈕中相同的name 將複選鈕群組
checked="checked"設定為默認項
*****下拉菜單*****
<select>
<option>台北</option>
<option>新竹</option>
<option>台中</option>
<option>台南</option>
</select>
<select>為下拉選單
<option>台北</option> 則為選項
*****按鈕*****
<input type="button" value="Bt1"/>
type 設定為 button 則為按鈕
可用於點及後觸發事件
*****submit*****
<input type="submit" value="提交" />
type="submit" 則為提交按鈕 可將<from></from>
中資訊提交給server
*****重置 reset*****
<input type="reset" value="重置" />
type設定為"reset"，則此按鈕為重置鍵
按下重置鈕 可將<from></from> 中內容還原初始值
*******************************
name:表單名稱
method :請求方式/post
<!-- name 不加入亦可 -->
<form name="test" method="get" action="https://www.google.com">
<!-- 文本域 -->
<p>
<!-- type="text" 輸入框類型
placeholder :提示文本
value:輸入的內容 -->
帳號:<input type="text" placeholder="手機號 or Email" value="1234" />
</p>
<!-- 密碼 -->
<p>
<!-- 密碼輸入type="password" 不顯是輸入內容-->
password:<input type="password" placeholder="六位數密碼" >
</p>
<!-- 單選框 -->
<p>
<!-- 單選框只能選一個由相同的name群組所以相同name 使用 radio type
只能選擇一個。checked : 默認選項-->
<input type="radio" name="sex" checked="checked">男
<input type="radio" name="sex">女
<input type="radio" name="sex">中性
</p>
<!-- 複選框 -->
<p>
<!-- 複選框 一樣可以用name 群組
checked : 默認選項
type checkbox
-->
<input type="checkbox" name="like" />睡覺
<input type="checkbox" name="like" checked="checked" />吃飯
<input type="checkbox" name="like" />打豆豆
</p>
<!-- 下拉菜單 select option-->
<p>
<!-- <select> </select> 下拉選單 <option>:選項-->
<select>
<option>台北</option>
<option>新竹</option>
<option>台中</option>
<option>台南</option>
</select>
</p>
<!-- 按鈕
value : 顯示 -->
<p>
<input type="button" value="Bt1"/>
<input type="button" value="Bt2"/>
</p>
<!-- 特殊按鈕 -->
<!-- 提交subnit 即提交到表單域action所指的位置 -->
<p>
<input type="submit" value="提交" />
</p>
<!-- 重置 重置所對應的表單域 -->
<p>
<input type="reset" value="重置" />
</p>
</form>
留言
張貼留言