第三篇
HTML教學
第九節
網頁表單
圖片按鈕表單 Button 範例
<
Button
Type
="
Submit
"|"
Reset
"|"
Button
"
Name
="
資料欄位名稱
"
>
<
Img
Src
="
URL
"
>
<
/Button
>
<Form>
您的大名:
郵件信箱:
</Form>
<
Button
>
使用時機:用於想使用圖檔來美化表單的按鈕時。
<
Form
>
...
<
/Form
>
表單開始與結束宣告,此對標籤絕對不能省略。
<
Button
>
...
<
/Button
>
圖片按鈕範圍開始與結束宣告,此對標籤最好不要省略。
注意:這裡的
<
Button
>
...
<
/Button
>
用法與
<Input
Type
="
Button
"
>
不太一樣,去比較看看
。
屬性
Name
="
資料欄位名稱值
"
為非必要設定值,提供給後端程式處理的變數值
(取名稱時最好與欄位有關)
。
屬性
Type
的值可(使)用於 "
Submit
"|"
Reset
"|"
Button
" 表單類型。
屬性
Src
="
URL
"
用法與網頁圖片一樣,如果您忘記了,請回頭再覆習一吧!
另一種圖片顯示方式,這只是加入一張圖示而已。
HTML標籤
<
Button
Type
="
Submit
"
>
<
Img
Src
="
images/search.gif
"
>
<
br
>
查詢
<
/Button
>
<Form>
您的大名:
郵件信箱:
查詢
清除
</Form>
因為
<
Button
>
...
<
/Button
>
圖片按鈕標籤,不用設定
Value
值,所以會以預設值顯示。
屬性
Name
="
資料欄位名稱值
"
為非必要設定值,提供給後端程式處理的變數值
(取名稱時最好與欄位有關)
。
用於屬性
Submit
同意或確認按鈕時,此處如果沒有設定
Value
值,會以預設值【查詢】顯示。
用於屬性
Reset
清除已輸入的填寫資料按鈕時,此處如果沒有設定
Value
值,會以預設值【清除】顯示。
注意:這裡所說的顯示預設值,是瀏覽器根據使用中、英文(其他語言)版本不同,自動顯示它的語系喔。