HTML表單標籤基本介紹

HTML標籤:表單標籤

  • 表單:
  • 概念:用於採集用戶輸入的數據的。用於和服務器進行交互。

一、 form標籤:用於定義表單的。可以定義一個範圍,範圍代表採集用戶數據的範圍

屬性介紹:

  • action:指定提交數據的URL
  • method:指定提交方式
  • 分類:一共7種,2種比較常用
  • get:
  1. 請求參數會在地址欄中顯示。會封裝到請求行中(HTTP協議後講解)。
  2. 請求參數大小是有限制的。
  3. 不太安全。
  • post:
  1. 請求參數不會再地址欄中顯示。會封裝在請求體中(HTTP協議後講解)
  2. 請求參數的大小沒有限制。
  3. 較爲安全。
  • 表單項中的數據要想被提交:必須指定其name屬性

二、表單項標籤:就是在form標籤中嵌套的標籤

input標籤:可以通過type屬性值,改變元素展示的樣式

1. 常用的type屬性:

  • text:文本輸入框,默認值
  • placeholder:指定輸入框的提示信息,當輸入框的內容發生變化,會自動清空提示信息
  • password:密碼輸入框
  • radio:單選框
    – 注意:
  1. 要想讓多個單選框實現單選的效果,則多個單選框的name屬性值必須一樣。
  2. 一般會給每一個單選框提供value屬性,指定其被選中後提交的值
  3. checked屬性,可以指定默認值
  • checkbox:複選框
    – 注意:
  1. 一般會給每一個單選框提供value屬性,指定其被選中後提交的值
  2. checked屬性,可以指定默認值

2. 不常用type屬性

  • file:文件選擇框
  • hidden:隱藏域,用於提交一些信息。
  • 按鈕:
  • submit:提交按鈕。可以提交表單
  • button:普通按鈕
  • image:圖片提交按鈕
  • src屬性指定圖片的路徑
  • label:指定輸入項的文字描述信息

  • 注意:

  • label的for屬性一般會和 input 的 id屬性值 對應。如果對應了,則點擊label區域,會讓input輸入框獲取焦點。

  • select: 下拉列表

  • 子元素:option,指定列表項

  • textarea:文本域

  • cols:指定列數,每一行有多少個字符

  • rows:默認多少行。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章