課程**看這裡~
乙個網頁上不僅有我們要給使用者看的內容,也需要與使用者進行互動,此時我們需要使用html表單。
html表單的功能為把使用者輸入的資料傳送到伺服器端,以便伺服器端處理資料。語法如下:
其中:
type:當type=
"text"時,輸入框為文字輸入框;
當type=
"password"時, 輸入框為密碼輸入框。
name:為文字框命名,以備後台程式使用
value:為文字輸入框設定預設值。(一般起到提示作用)
當我們需要輸入大段文字時,乙個文字框是不夠的,這時我們需要使用支援多行文字輸入的文字域。
語法如下:
rows="行數"
cols="列數">文字textarea>
其中:標籤是成對出現的,以開始,以textarea>結束,在,textarea>標籤之間可以輸入預設值。
cols :多行輸入域的列數。
rows :多行輸入域的行數。
注:cols與rows屬性可用css樣式的width和height來代替:col用width、row用height來代替。(這兩個css樣式在後續更新中會講解)
2:單選框與核取方塊
html中有兩種選擇框,即單選框和核取方塊,兩者的區別是單選框中的選項使用者只能選擇一項,而核取方塊中使用者可以任意選擇多項,甚至全選。
語法如下:
type=
"radio/checkbox"
value="值" name="名稱" checked="checked"/>
其中:type:當 type=
"radio" 時,控制項為單選框
當 type=
"checkbox" 時,控制項為核取方塊
value:提交資料到伺服器的值,以備後台程式使用
name:為控制項命名,以備後台程式使用
checked:當設定 checked="checked" 時,該選項被預設選中
注:同一組的單選按鈕,name 取值一定要一致!這樣同一組的單選按鈕才可以起到單選的作用。
3:下拉列表
網頁中我們常常用到下拉列表,它可以有效節省網頁空間,可以單選亦可以多選,例子如下:
其中:
value:value="提交值">選項(顯示的值)option>
selected="selected":設定預設選中選項。
若要進行多選,則在
標籤中設定multiple=」multiple」屬性,在windows作業系統中按下ctrl鍵的同時單擊選中表項(mac作業系統下使用command+單擊),例子如下:
name="iform">
愛好:label>
multiple="multiple">
value="讀書">讀書option>
value="運動">運動option>
value="**">**option>
value="旅遊">旅遊option>
value="購物">購物option>
select>
form>
4:提交與重置按鈕
表項完成後需要進行提交,此時我們需要用到提交按鈕
語法如下:
type=
"submit"
value="提交">
其中:type:只有當type值設定為submit時,按鈕才有提交作用
value:按鈕上顯示的文字
舉個例子:
當type設定為reset時,按鈕有重置作用,即,當我們資訊輸入錯誤時可以點重置按鈕進行重置操作,然後進行常規操作。
語法如下:
type=
"reset"
value="重置">
其中:type:只有當type值設定為reset時,按鈕才有重置作用
value:按鈕上顯示的文字
例子如下:
5:label
標籤
在上述例子中我們多次用到標籤,現在我們就來學習它的具體用法。
label標籤不呈現任何特殊效果,它的作用是為滑鼠使用者改進了可用性。就是說,當使用者單擊選中該label標籤時,瀏覽器就會自動將焦點轉到和標籤相關的表單控制項上(就自動選中和該label標籤相關連的表單控制項上)。具體語法如下:
for="控制項id名稱">
for="male">男label>
type="radio"
name="gender"
id="male" />
for="female">女label>
type="radio"
name="gender"
id="female" />
for="email">輸入你的郵箱位址label>
type="email"
id="email"
placeholder="enter email">
form>
更多功能請期待後續更新博文! HTML CSS基礎課程(一)
一 給div命名 語法 二 table標籤,製作網頁上的 建立 的四個元素 table tbody tr th td 1 標記開始 標記結束 3 的一行,所以有幾對tr 就有幾行 4 的乙個單元格,一行中包含幾對.說明一行中就有幾列 5 的頭部的乙個單元格,表頭 6 中列的個數,取決於一行中資料單元...
HTML CSS基礎課程(四)
一 文字輸入框 密碼輸入框 當使用者要在表單中鍵入字母 數字等內容時,就會用到文字輸入框。文字框也可以轉化為密碼輸入框。語法 1 type 當type text 時,輸入框為文字輸入框 當type password 時,輸入框為密碼輸入框 2 name 為文字框命名,以備後台程式asp php使用。...
慕課網HTML CSS基礎課程學習
慕課網html css基礎課程 為了做好乙個功能全面的 我開始從零開始學習,第一步先學習html css,js學習之後也會更新。網頁主要由html哪些標籤構成 人是由頭和身體構成,同樣的網頁也是由 頭 和 身體 構成,頭 是head,文件的頭部描述了文件的各種屬性和資訊,包括文件的標題等 身體 是b...