HTML基礎教學之表單簡介LOGIN

HTML基礎教學之表單簡介

首先來看下幾個入口網站的使用者註冊介面:

淘寶

11.png

百度:

12.png

這些都是表單的內容,也是一個網站的必備功能,接下來,我們來學習表單的基礎:


表單的概念

#表單主要用來取得客戶端使用者資料(資訊)的。如:註冊表單、查詢表單、登入表單等。


表單的工作原理

  • 瀏覽有表單的網頁,填寫一些必要的信息,然後點擊某個按鈕進行提交。

  •  這些表單數據,透過互聯網,傳遞到了伺服器。

  • 伺服器上有專門的程序,對表單資料進行驗證。如果驗證成功,將你的資料存入資料庫(MySQL),則傳回一個驗證成功的資訊。如果驗證失敗,將傳回一個錯誤訊息。

從上面表單的工作原來看:表單的製作分成兩個部分,一是前台頁面的製作,二是後台程式對表單資料的處理。本課程只介紹前台頁面製作部分


表單的結構

#以下是一個簡單的表單,我們會在接下來的時間學習它的每一個部分

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>用户注册</title>
    </head>
    <body>
        <font size="5" color="red">欢迎注册php.cn</font>
        <form name="user" method="get" action="" >
            用户名:<input type="text" name="username"/>
            <br/>
            密码:<input type="password" name="userpwd"/>
            <br/>
            <input type="submit" value="提交信息"/>
        </form>
    </body>
</html>

# #註:由於條件限制,所以希望大家在本地測試表單這一章的所有實例下一節

<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>用户注册</title> </head> <body> <font size="5" color="red">欢迎注册php.cn</font> <form name="user" method="get" action="" > 用户名:<input type="text" name="username"/> <br/> 密码:<input type="password" name="userpwd"/> <br/> <input type="submit" value="提交信息"/> </form> </body> </html>
章節課件