html中form表單的使用方法和介紹

2021-09-06 19:58:24 字數 1439 閱讀 1195

一、表單賞析

二、了解表單

功能:用於蒐集不同型別的使用者輸入的內容

有了表單,網頁的內容可以由使用者自己建立,那麼對於網頁來說,我們既是網頁建立都者,也是網頁的消費者。

三、常用的表單元素

ü  form   表單

ü  input   表單元素,表單項

ü  select和option  下拉列表

ü  textarea 文字域

(1)form元素

功能:用於建立乙個表單

格式:

基本用法:

重要屬性:

1,action:表示當前表單中的內容提交給哪個頁面進行處理

2,method:表示當前表單提交的方式,常見的有get和post方式,預設是get提交

(2)input元素

表示輸入框,有多種形式,可以根據type屬性來確定顯示哪種輸入框。

基本用法:

效果 :

注意細節:

1,對於input來說,它的type的預設值是text,表示單行文字

2,對於input,最好給它新增乙個name屬性,作用是用於將使用者輸入的內容提交給要處理這個資料的頁面

get提交與post提交:

get:

如果以get方式進行提交,但沒有寫上name屬性,那麼使用者輸入的內容是提交不了的,但是也會出現?這個標誌:

post:

get和post小結:

1,get會將使用者輸入的內容放到位址列裡面,使用get請求不安全

2,post不會將使用者輸入的內容放到位址列裡面,相對安全

細節:1,每乙個input標籤都有乙個value屬性,不同型別的input, value的作用也不同

對於type=」text」來說,value可有可無,因為使用者輸入的內容都可以提交過去。

對於type=」radio」或type=」checkbox」來說,沒有value,是提交不了的。

2,對於type=」radio」來說,如果你只想選擇乙個,需要給每個input新增乙個name屬性,屬性值也必須一致,如果不新增,就不能滿足單選框的需求。

3,關於單行文字的寬度,可以使用size屬性來設定,表示字元長度,實際上不用,我們一般是通過css進行控制的。

(3)select和option

作用:用來實現下拉列表

格式:內容 內容

內容

基本用法:

注意點:

1,預設情況下,提交時,它將option裡面的內容作為提交的內容,但是通常我們不這樣做,我們通常給opton設定乙個value屬性,屬性值我們通常用數字。

使用value後的情況如下:

我們可以使用selected屬性讓某個option處理預設選中狀態。

(3)textarea

作用:提供輸入大量文字的輸入框,比如,qq空間中發表狀態,貼吧發表貼子等。

格式:

基本用法:

html中form表單標籤的使用

在html中,表單是經常用到的,用來與使用者互動並提交資料。今天要介紹的就是表單標籤form標籤 form 作為英文單詞有 的意思 標籤是使用來建立供使用者輸入的html表單,在網頁中很常見,比如 註冊和登入頁面就是用表單實現的。標籤中通常會有很多子元素,用來定義各種互動控制項 文字字段 核取方塊 ...

HTML5中的form表單

元素用於生成輸入表單,該元素不會生成視覺化部分,它除了通用屬性id style class外,還可以指定onclick事件,除此之外,還有以下幾個屬性 action 指定當單擊表單內的確認按鈕時,該表單被提交到那個位址。該屬性既可以指定乙個絕對位址,也可以指定乙個相對位址,該屬性必填,非常重要!me...

關於html 中form表單的內標籤和使用

表單標記 1.普通文字框 名稱 value 值 不寫 value 預設為空 2.密碼框 名稱 value 值 不寫 value 預設為空 3.單選按鈕 一組名稱 value 值 4.多選框 一組名稱 value 值 5.下拉列表 名稱 值 描述 值 描述 值 描述 值 描述 6.按鈕 提交按鈕 顯示...