登錄表單
初識表單
今天我們來學習表單。
在我們的生活中，離不開表單，在我們註冊帳號的時候，或者買東西輸入地址或者登陸帳號密碼的時候，這時候我們用到都是表單的內容。
我們就拿一個登錄表單為例
我們需要一個文本輸入框輸入用戶名，需要一個密碼輸入框輸入密碼，需要一個提交按鈕進行登錄，而這些東西都需要包裹在一個from標籤裡
通常在一個表單裡面，有許多表單控制項，有文本框、密碼框、單選按鈕、複選框等等
這些表單控制項全部都是由input標籤編寫出來的，但是一個標籤怎麼會有這麼多效果呢？
主要原因就在於input當中的type屬性，他有很多值，每個值對應不同效果
具體如下所示，左邊的每個值對應右邊的顯示效果：
掌握了上面這些，我們就可以編寫一個簡單的表單了
編寫簡單表單
我們來編寫一下上面的這個簡單的表單
我們先來分析一下它，這是一個4行3列的表格，根據我們之前學的表格的知識，我們先來製作出這樣一個表格
效果如下：
我們先來合併該表格
1.第一行的第一個單元格的rowspan=4，並且刪除下面三個的第一列
2.第一行的最後一個單元格刪除，讓第二個單元格clospan=2
3.最下面一行的最後一個單元格也刪除，並且中間單元格clospan=2
顯示效果如下：
大致的結構我們就編寫完成了，下面開始填寫內容
效果如下：
文字輸入完成後，我們就要開始編寫表單中的控制項了
效果如下，用戶名和密碼可以輸入，但是按鈕只是很小的一個和我們要做的效果差別很大
我們需要給按鈕加上vlue屬性文字，按鈕大小就會跟隨文字的多少
效果如下
我們再來設置他們的對齊方式align
1.設置提交和重置按鈕為居中顯示align=」center」
2.用戶名和密碼文字為右對齊align=」right」
3.總體信息為居中對齊align=」center」
但是現在有一個問題，我們點擊提交和重置時沒有任何反應
這是因為我們現在所寫的按鈕只是最普通的按鈕button，要想使按鈕有作用，我們現在缺少兩個條件：
1.整個表格不在from標籤內，action為表單提交的地址
2.按鈕要對應的type值，submit為提交，reset為重置
效果點擊提交時，頁面就會有刷新的動作
如果我們在action屬性中輸入一個網址，例如http://www.baidu.com，那麼點擊提交的時候就會跳轉到百度首頁。
重置的將button改為reset即可。
我們來總結一下
1.四個需要記住的：
2.type中的屬性值含義：
- End –
---web分享，分享的不只是web
本文由AnXuelin原創，歡迎關注，帶你一起長知識！