html中label標簽屬性介紹 html中label標簽的用法

1.form 標簽1)作用<form></form>定義表單的開始位置和結束位置,表單提交時的內容就是<form>表單中的內容2)基本格式<form action="服務器端地址(接受表單內容的地址)" name="表單名稱" method="post|get">...</form>3)常用屬性1.name表單名稱
2.method傳送數據的方式,分為post和get兩種方式:

  1. get方式:get方式提交時,會將表單的內容附加在URL地址的后面,所以限制了提交的內容的長度,不超過8192個字符,且不具備保密性 。
  2. post方式:post方式提交時,將表單中的數據一并包含在表單主體中,一起傳送到服務器中處理,沒有數據大小限制 。
3.action【html中label標簽屬性介紹 html中label標簽的用法】表單數據的處理程序的URL地址,如果為空則使用當前文檔的URL地址,如果表單中不需要使用action屬性也要指定其屬性為”no“ 。
4.enctype設置表單的資料的編碼方式 。屬性值:
  1. application/x-www-form-urlencoded:在發送前編碼所有字符(默認)
  2. multipart/form-data:不對字符編碼 。在使用包含文件上傳控件的表單時,必須使用該值 。
  3. text/plain:空格轉換為 “+” 加號,但不對特殊字符編碼 。
5.target和超鏈接的屬于類似,用來指定目標窗口 。
2.input 標簽1)注意input 標記沒有結束標記 。
2)基本語法<input type="" name="" value="" size="" maxlength="">3)屬性1.type屬性
  1. text:文本輸入域
  2. password:密碼輸入域
  3. submit:提交按鈕
  4. reset:重置按鈕
  5. button:普通按鈕
  6. radio:單選按鈕,可以使用”checked“屬性來設置默認選中項
  7. checkbox:復選框,可以使用”checked“屬性來設置默認選中項
  8. hidden:隱藏表單域
  9. file:文件域
2.name屬性定義控件的名稱
3.value屬性初始化值,打開瀏覽器時,文本框中的內容
4.size屬性設置控件的長度
5.maxlength屬性輸入框中最大允許輸入的字符數
3.textarea 標簽1)作用使用 textarea 標記可以實現一個能夠輸入多行文本的區域 。
2)語法格式rows屬性和cols屬性分別用來指定,顯示的行數和列數,單位是字符個數;value指定傳送到服務器上面的值 。
<textarea name="name" rows="value" cols="value" https://www.cnfyg.com/shcs/value="value">... ... </textarea>4.select 標簽1)作用菜單下拉列表域,生成一個下拉列表 。
2)option 標簽作用:
option 標記用來指定列表中的一個選項,需要放在 select 之間 。
值:
  1. value:給選項賦值,指定傳送到服務器上面的值 。
  2. selected:指定默認的選項 。
3)語法格式<select name="" size="value" multiple><option value="https://www.cnfyg.com/shcs/value1" selected>選項1</option><option value="https://www.cnfyg.com/shcs/value2">選項2</option><option value="https://www.cnfyg.com/shcs/value3">選項3</option>... ... ...</select>4)屬性
  1. multiple屬性:multiple屬性不用賦值,其作用是,表示用可以多選的下來列表,如果沒有這個屬性就只能單選 。
  2. size屬性:設置列表的高度 。
  3. name屬性:定義這個列表的名稱 。
5.label 標簽1)作用用于綁定一個表單元素, 當點擊label標簽的時候, 被綁定的表單元素就會獲得輸入焦點
2)語法<label for="male">Male</label><input type="radio" name="sex" id="male">6.舉例<form name="form" method="post" action="no" enctype="multipart/form-data"><label for="male">賬號:</label><input type="text" name="username" value="https://www.cnfyg.com/shcs/admin"id="male"><br>密碼:<input type="password" name="password" size="50" maxlength="6"><br>性別:<input type="radio" name="sex" value="https://www.cnfyg.com/shcs/男"> 男<input type="radio" name="sex" value="https://www.cnfyg.com/shcs/女" checked="checked"> 女<br>興趣:<input type="checkbox" name="interest" value="https://www.cnfyg.com/shcs/籃球">籃球<input type="checkbox" name="interest" value="https://www.cnfyg.com/shcs/足球" checked="checked">足球<input type="checkbox" name="interest" value="https://www.cnfyg.com/shcs/羽毛球" checked="checked">羽毛球<input type="hidden" name="hidden"><br>頭像:<input type="file" name="file"><br>簡介:<textarea rows="10" cols="30"></textarea><br>城市:<select name="city" multiple><option value="https://www.cnfyg.com/shcs/beijing">北京</option><option value="https://www.cnfyg.com/shcs/shanghai" selected>上海</option><option value="https://www.cnfyg.com/shcs/nanjing">南京</option><option value="https://www.cnfyg.com/shcs/guangdong">廣東</option></select><br><input type="submit" value="https://www.cnfyg.com/shcs/注冊"><input type="reset"><input type="button" value="https://www.cnfyg.com/shcs/普通按鈕"></form>
html中label標簽屬性介紹 html中label標簽的用法

文章插圖

    推薦閱讀