簡單的站內信系統-php手册-PHP中文網

　　到公司實習一個月了，做了十幾年的學生，突然就變成了一名員工。從說「去上課了」變成了「去上班了」。會或多或少的有一些不適應，不管是生活方式還是學習方式甚至是朋友圈都有了特別大的變化。從開始的時候沒有什麼思路，不知道該怎麼去適應公司的工作環境，該怎麼去學習才能做一名合格的員工，該學習哪些知識才能適應公司的需求，那麼多的工作我到底適合做哪一個。到現在為止，終於不是那麼很迷茫，知道自己喜歡什麼，知道自己適合什麼，知道自己的目標是什麼，願意一步一步的去前進去奮鬥，我想這就是很大的進步吧。每一份工作，每一次經歷，我相信都會在某一方面給我很大的啟發。

　　越努力越幸運，加油～！

1.主要實現功能及工具

　　1>使用Mysql資料庫，使用Bootstrap框架

　　2>能夠實現登入註冊功能，並附有簡單的驗證

　　3>能夠實現發送郵件查看郵件選擇收件人的功能

　　4>發信時能夠制定標題內容

2.注意事項

　　1>提交按鈕用標籤，button標籤不可以。出現問題：找不到請求按鈕

　　2>php程式碼和頁面分開寫，有時會出現一些notice提示，影響頁面美觀

　　3>登入時注意用session儲存登入的使用者

　　4>登入驗證問題

　　5>查看寄件匣收件匣的sql語句要寫收件者和寄件者的條件，否則會顯示所有信箱的內容

　　6>注意一些值為空的情況要寫判斷語句

　　7>注意格式排版！！慢慢提高，寫的真的好亂～！

3.資料庫設計

　　1>使用者表：ID,userID,username,password,confirmPassword,isAdmin,emial

　　2>郵件內容:emailBoxID,receiver,sender,title,content

4.思路及步驟

　　1>登入介面的實作

　　2>資料庫的設計

　　3>主介面，註冊介面的設計與實作

　　4>發送郵件郵件清單寄件箱介面設計與實作

　　5>查找缺陷補充

5.登入頁

<span style="color: #0000ff;"><</span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>
    <span style="color: #0000ff;"><</span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>
        <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">http-equiv</span><span style="color: #0000ff;">="Content-Type"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">="text/html; charset=utf-8"</span> <span style="color: #0000ff;">/></span>
        <span style="color: #0000ff;"><</span><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>邮箱登录<span style="color: #0000ff;"></</span><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>
        <span style="color: #0000ff;"><</span><span style="color: #800000;">link </span><span style="color: #ff0000;">rel</span><span style="color: #0000ff;">="stylesheet"</span><span style="color: #ff0000;"> href</span><span style="color: #0000ff;">="../bootstrap/css/bootstrap.min.css"</span><span style="color: #0000ff;">/></span>
        <span style="color: #0000ff;"><</span><span style="color: #800000;">link </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="../bootstrap/js/jquery.min.cs"</span><span style="color: #0000ff;">/></span>
        <span style="color: #0000ff;"><</span><span style="color: #800000;">link </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="../bootstrap.min.js"</span><span style="color: #0000ff;">/></span>
    <span style="color: #0000ff;"></</span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span> 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">style </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="text/css"</span><span style="color: #0000ff;">></span><span style="background-color: #f5f5f5; color: #800000;">
            html,body</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
                    height</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 100%</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                    background-color</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> #A3D5FB</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
            <span style="background-color: #f5f5f5; color: #000000;">}</span><span style="background-color: #f5f5f5; color: #800000;">
            
            .login-box</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
                width</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 100%</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                max-width</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 400px</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                height</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 700px</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                position</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> absolute</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                top</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 50%</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">    
                margin-top</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> -200px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>        
            <span style="background-color: #f5f5f5; color: #000000;">}</span><span style="background-color: #f5f5f5; color: #800000;">
            .form-group</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
                margin-bottom</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 30px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
            <span style="background-color: #f5f5f5; color: #000000;">}</span><span style="background-color: #f5f5f5; color: #800000;">
            .login-title</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
                padding</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 20px 10px</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                background-color</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> rgba(0,0,0,0.6)            
            </span><span style="background-color: #f5f5f5; color: #000000;">}</span><span style="background-color: #f5f5f5; color: #800000;">
            .login-title small</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
                color</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> #fff</span><span style="background-color: #f5f5f5; color: #000000;">;</span>            
            <span style="background-color: #f5f5f5; color: #000000;">}</span><span style="background-color: #f5f5f5; color: #800000;">
            .login-content</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
                height</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 400px</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                width</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 100%</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                max-width</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 500px</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                background-color</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> rgba(255,255,255,0.6)</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                float</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> left</span><span style="background-color: #f5f5f5; color: #000000;">;</span>            
            <span style="background-color: #f5f5f5; color: #000000;">}</span><span style="background-color: #f5f5f5; color: #800000;">
            @media screen and (min-width:500px)</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
                .login-box {
                        left</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 50%</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
                        margin-left</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> -250px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
    <span style="background-color: #f5f5f5; color: #000000;">}</span><span style="background-color: #f5f5f5; color: #800000;">
}
    .btn</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
        padding</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 6px 30px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="background-color: #f5f5f5; color: #000000;">}</span><span style="background-color: #f5f5f5; color: #800000;">
    .input-group</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
        margin-bottom</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 0px</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
        margin</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 0px 0px 30px 0px</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
        height</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 50px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>    
    <span style="background-color: #f5f5f5; color: #000000;">}</span><span style="background-color: #f5f5f5; color: #800000;">
    .form-control</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
        height</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 50px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>    
    <span style="background-color: #f5f5f5; color: #000000;">}</span><span style="background-color: #f5f5f5; color: #800000;">
    .link p</span><span style="background-color: #f5f5f5; color: #000000;">{</span><span style="background-color: #f5f5f5; color: #ff0000;">
        line-height</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 20px</span><span style="background-color: #f5f5f5; color: #000000;">;</span><span style="background-color: #f5f5f5; color: #ff0000;">
        margin-top</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 30px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>    
        
    <span style="background-color: #f5f5f5; color: #000000;">}</span>

            
    <span style="color: #0000ff;"></</span><span style="color: #800000;">style</span><span style="color: #0000ff;">></span>
    <span style="color: #0000ff;"><</span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
    <span style="color: #0000ff;"><</span><span style="color: #800000;">script </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="text/javascript"</span><span style="color: #0000ff;">></span>
        <span style="background-color: #f5f5f5; color: #0000ff;">function</span><span style="background-color: #f5f5f5; color: #000000;"> doSubmit() {
            </span><span style="background-color: #f5f5f5; color: #0000ff;">if</span><span style="background-color: #f5f5f5; color: #000000;">($(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">#username</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).value()){
                alert(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">用户名不能为空</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">);
                </span><span style="background-color: #f5f5f5; color: #0000ff;">return</span><span style="background-color: #f5f5f5; color: #000000;">;            
            }
            </span><span style="background-color: #f5f5f5; color: #0000ff;">if</span><span style="background-color: #f5f5f5; color: #000000;"> ($(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">#password</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).value)) {
                alert(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">密码不能为空</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">);
                </span><span style="background-color: #f5f5f5; color: #0000ff;">return</span><span style="background-color: #f5f5f5; color: #000000;">;
            }
            $(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">form1</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).submit();
        }
    </span><span style="color: #0000ff;"></</span><span style="color: #800000;">script</span><span style="color: #0000ff;">></span>

    
        <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="container"</span><span style="color: #0000ff;">></span>
            <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="box"</span><span style="color: #0000ff;">></span>
                <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="login-box"</span><span style="color: #0000ff;">></span>
                    <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="login-title text-center"</span><span style="color: #0000ff;">></span>
                        <span style="color: #0000ff;"><</span><span style="color: #800000;">h1</span><span style="color: #0000ff;">><</span><span style="color: #800000;">small</span><span style="color: #0000ff;">></span>站内信登录<span style="color: #0000ff;"></</span><span style="color: #800000;">small</span><span style="color: #0000ff;">></</span><span style="color: #800000;">h1</span><span style="color: #0000ff;">></span>
                    <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                    <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="login-content"</span><span style="color: #0000ff;">></span>
                        <span style="color: #0000ff;"><</span><span style="color: #800000;">form </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="form1"</span><span style="color: #ff0000;"> method</span><span style="color: #0000ff;">="post"</span><span style="color: #ff0000;"> action</span><span style="color: #0000ff;">="../php/login.php"</span><span style="color: #0000ff;">></span>
                            <span style="color: #008000;"><!--</span><span style="color: #008000;">用户ID</span><span style="color: #008000;">--></span>
                                <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="form-group"</span><span style="color: #0000ff;">></span>
                                    <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="col-md-12"</span><span style="color: #0000ff;">></span>
                                        <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="input-group"</span><span style="color: #0000ff;">></span>
                                            <span style="color: #0000ff;"><</span><span style="color: #800000;">span </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="input-group-addon"</span><span style="color: #0000ff;">><</span><span style="color: #800000;">span </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="glyphicon glyphicon-user"</span><span style="color: #0000ff;">></</span><span style="color: #800000;">span</span><span style="color: #0000ff;">></</span><span style="color: #800000;">span</span><span style="color: #0000ff;">></span>
                                            <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="text"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="userID"</span><span style="color: #ff0000;"> id</span><span style="color: #0000ff;">="userID"</span><span style="color: #ff0000;"> class</span><span style="color: #0000ff;">="form-control"</span><span style="color: #ff0000;"> placeholder</span><span style="color: #0000ff;">="用户ID"</span><span style="color: #0000ff;">></span>    
                                        <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                                    <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                                <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                            <span style="color: #008000;"><!--</span><span style="color: #008000;">密码</span><span style="color: #008000;">--></span>
                                <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="form-group"</span><span style="color: #0000ff;">></span>
                                    <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="col-md-12"</span><span style="color: #0000ff;">></span>
                                        <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="input-group"</span><span style="color: #0000ff;">></span>
                                            <span style="color: #0000ff;"><</span><span style="color: #800000;">span </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="input-group-addon"</span><span style="color: #0000ff;">><</span><span style="color: #800000;">span </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="glyphicon glyphicon-lock"</span><span style="color: #0000ff;">></</span><span style="color: #800000;">span</span><span style="color: #0000ff;">></</span><span style="color: #800000;">span</span><span style="color: #0000ff;">></span>
                                            <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="password"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="password"</span><span style="color: #ff0000;"> id</span><span style="color: #0000ff;">="password"</span><span style="color: #ff0000;"> class</span><span style="color: #0000ff;">="form-control"</span><span style="color: #ff0000;"> placeholder</span><span style="color: #0000ff;">="密码"</span><span style="color: #0000ff;">></span>            
                                        <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                                    <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                                <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                            <span style="color: #008000;"><!--</span><span style="color: #008000;">登录按钮</span><span style="color: #008000;">--></span>
                                <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="form-group"</span><span style="color: #0000ff;">></span>
                                    <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="col-md-4 col-md-offset-4"</span><span style="color: #0000ff;">></span>
                                        <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="btn btn-info active navbar-btn "</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="submit"</span><span style="color: #ff0000;"> id</span><span style="color: #0000ff;">="submit"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="submit"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="登录"</span><span style="color: #0000ff;">></span>
                                    <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                                <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>

                                    <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="form-group"</span><span style="color: #0000ff;">></span>

                                            <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="col-md-12 col-md-offset-9 link"</span><span style="color: #0000ff;">></span>
                                            <span style="color: #0000ff;"><</span><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="input-group"</span><span style="color: #0000ff;">></span>
                                                <span style="color: #0000ff;"><</span><span style="color: #800000;">p </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="text-center remove-margin"</span><span style="color: #0000ff;">></span> <span style="color: #0000ff;"><</span><span style="color: #800000;">a </span><span style="color: #ff0000;">href</span><span style="color: #0000ff;">="javascript:void(0)"</span><span style="color: #0000ff;">></span>忘记密码<span style="color: #0000ff;"></</span><span style="color: #800000;">a</span><span style="color: #0000ff;">></span>
                                                <span style="color: #0000ff;"></</span><span style="color: #800000;">p</span><span style="color: #0000ff;">></span>

                                                <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                                            <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>        
                                        <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                                                            
                        <span style="color: #0000ff;"></</span><span style="color: #800000;">form</span><span style="color: #0000ff;">></span>                    
                    <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
                <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>            
            <span style="color: #0000ff;"></</span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
    <span style="color: #0000ff;"></</span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"></</span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>

登入後複製

6.幫助類

<span style="color: #008080;"> 1</span> <?<span style="color: #000000;">php
</span><span style="color: #008080;"> 2</span>     <span style="color: #0000ff;">if</span> (!<span style="color: #0000ff;">isset</span> (<span style="color: #800080;">$_SESSION</span><span style="color: #000000;">)) {
</span><span style="color: #008080;"> 3</span>     <span style="color: #008080;">ob_start</span><span style="color: #000000;">();
</span><span style="color: #008080;"> 4</span>     <span style="color: #008080;">session_start</span><span style="color: #000000;">();
</span><span style="color: #008080;"> 5</span> <span style="color: #000000;">}
</span><span style="color: #008080;"> 6</span>  <span style="color: #008080;">header</span>("Content-type:text/html;charset=utf-8"<span style="color: #000000;">);
</span><span style="color: #008080;"> 7</span>       <span style="color: #800080;">$conn</span>=<span style="color: #008080;">mysql_connect</span>('127.0.0.1','root','root'<span style="color: #000000;">);
</span><span style="color: #008080;"> 8</span>      <span style="color: #0000ff;">if</span>(<span style="color: #800080;">$conn</span><span style="color: #000000;">) {
</span><span style="color: #008080;"> 9</span>          <span style="color: #008080;">mysql_select_db</span>("MailUserManage", <span style="color: #800080;">$conn</span><span style="color: #000000;">);
</span><span style="color: #008080;">10</span>          <span style="color: #008080;">mysql_query</span>("set names 'utf-8'"<span style="color: #000000;">);
</span><span style="color: #008080;">11</span> <span style="color: #000000;">         }
</span><span style="color: #008080;">12</span>          <span style="color: #0000ff;">else</span><span style="color: #000000;"> {
</span><span style="color: #008080;">13</span>              <span style="color: #0000ff;">die</span><span style="color: #000000;">();
</span><span style="color: #008080;">14</span> <span style="color: #000000;">        }
</span><span style="color: #008080;">15</span> ?>

登入後複製

helper.php

7.登入功能實現

<span style="color: #008080;"> 1</span> <?<span style="color: #000000;">php
</span><span style="color: #008080;"> 2</span>     <span style="color: #0000ff;">require_once</span>("helper.php"<span style="color: #000000;">);
</span><span style="color: #008080;"> 3</span>     
<span style="color: #008080;"> 4</span> 
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;">if</span>(<span style="color: #0000ff;">isset</span>(<span style="color: #800080;">$_POST</span>['submit'<span style="color: #000000;">])) 
</span><span style="color: #008080;"> 6</span> <span style="color: #000000;">{
</span><span style="color: #008080;"> 7</span>         <span style="color: #800080;">$userID</span>=<span style="color: #800080;">$_POST</span>['userID'<span style="color: #000000;">];
</span><span style="color: #008080;"> 8</span>         <span style="color: #800080;">$password</span>=<span style="color: #800080;">$_POST</span>['password'<span style="color: #000000;">];
</span><span style="color: #008080;"> 9</span>         <span style="color: #800080;">$sql</span>="select * from Users where userID='<span style="color: #800080;">$userID</span>'"<span style="color: #000000;">;
</span><span style="color: #008080;">10</span>         <span style="color: #800080;">$result</span>=<span style="color: #008080;">mysql_query</span>(<span style="color: #800080;">$sql</span>) or <span style="color: #0000ff;">die</span>("帐号不正确"<span style="color: #000000;">);
</span><span style="color: #008080;">11</span>         <span style="color: #800080;">$num</span>=<span style="color: #008080;">mysql_num_rows</span>(<span style="color: #800080;">$result</span><span style="color: #000000;">);
</span><span style="color: #008080;">12</span>          <span style="color: #0000ff;">if</span>(<span style="color: #800080;">$num</span><span style="color: #000000;">) {
</span><span style="color: #008080;">13</span>             <span style="color: #800080;">$row</span>=<span style="color: #008080;">mysql_fetch_array</span>(<span style="color: #800080;">$result</span><span style="color: #000000;">);
</span><span style="color: #008080;">14</span>             
<span style="color: #008080;">15</span>         <span style="color: #0000ff;">if</span>(<span style="color: #800080;">$row</span>['password']==<span style="color: #800080;">$password</span><span style="color: #000000;">) {    
</span><span style="color: #008080;">16</span>             <span style="color: #0000ff;">echo</span> "登录成功，正在为您跳转至邮箱首页"<span style="color: #000000;">;    
</span><span style="color: #008080;">17</span>             <span style="color: #800080;">$_SESSION</span>['Users']=<span style="color: #800080;">$_POST</span>['userID'<span style="color: #000000;">];
</span><span style="color: #008080;">18</span>             <span style="color: #008080;">header</span>("Location:../index.php"<span style="color: #000000;">);
</span><span style="color: #008080;">19</span> <span style="color: #000000;">        }
</span><span style="color: #008080;">20</span>         <span style="color: #0000ff;">else</span><span style="color: #000000;"> {        
</span><span style="color: #008080;">21</span>             <span style="color: #0000ff;">echo</span> "<script>alert('密码错误，请重新输入');</script>"<span style="color: #000000;">;
</span><span style="color: #008080;">22</span>             <span style="color: #008080;">mysql_close</span><span style="color: #000000;">();
</span><span style="color: #008080;">23</span> <span style="color: #000000;">        }
</span><span style="color: #008080;">24</span> <span style="color: #000000;">    }
</span><span style="color: #008080;">25</span> <span style="color: #000000;">    }
</span><span style="color: #008080;">26</span>     <span style="color: #0000ff;">else</span><span style="color: #000000;">{
</span><span style="color: #008080;">27</span>         <span style="color: #0000ff;">echo</span> "<script>alert('请登录用户');</script>"<span style="color: #000000;">;    
</span><span style="color: #008080;">28</span> <span style="color: #000000;">    }
</span><span style="color: #008080;">29</span> 
<span style="color: #008080;">30</span> ?>

登入後複製

8.註冊介面

<span style="color: #008080;">1</span><span style="color: #0000ff;"><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">2</span>
<span style="color: #008080;">3</span><span style="color: #0000ff;"><span style="color: #800000;">頭</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span> <span style="color: #0000ff;"><span style="color: #800000;">元</span><span style="color: #ff0000;">字符集</span><span style="color: #0000ff;">="utf-8"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"><span style="color: #800000;">標題</span><span style="color: #0000ff;">></span>註冊新用戶<span style="color: #0000ff;"></span><span style="color: #800000;">標題</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 6</span> <span style="color: #0000ff;"><span style="color: #800000;">連結 </span><span style="color: #ff0000;">rel</span><span style="color: #0000ff;">="stylesheet"</span><span style="color: #ff0000;"> href</span><span style="color: #0000ff;">="../bootstrap/css/bootstrap.min..
</span>7<span style="color: #0000ff;"></span></span>連結<span style="color: #0000ff;"></span>src<span style="color: #800000;"></span>="../bootstrap/js/jquery.min.cs"<span style="color: #ff0000;"></span>/><span style="color: #0000ff;">
</span>8<span style="color: #0000ff;"></span></span>連結<span style="color: #0000ff;"></span>src<span style="color: #800000;"></span>="../bootstrap.min.js"<span style="color: #ff0000;"></span>/><span style="color: #0000ff;">
</span>9<span style="color: #0000ff;"></span></span>腳本<span style="color: #0000ff;"></span>><span style="color: #800000;">
</span>10<span style="color: #0000ff;">
</span>11<span style="color: #008080;"></span><span style="color: #008080;"></span>腳本<span style="color: #0000ff;"></span>><span style="color: #800000;">
</span>12<span style="color: #0000ff;">
</span>13<span style="color: #008080;"></span><span style="color: #008080;"></span>頭<span style="color: #0000ff;"></span>><span style="color: #800000;">
</span> 14<span style="color: #0000ff;"> </span></span>樣式<span style="color: #0000ff;"></span>型<span style="color: #800000;"></span>="text/css"<span style="color: #ff0000;"></span>><span style="color: #0000ff;">
</span>15<span style="color: #0000ff;"></span>身體<span style="color: #008080;"></span>{<span style="background-color: #f5f5f5; color: #800000;">
</span>16<span style="background-color: #f5f5f5; color: #000000;"></span>身高<span style="color: #008080;"></span>:<span style="background-color: #f5f5f5; color: #ff0000;"></span>100%<span style="background-color: #f5f5f5; color: #000000;"></span>;<span style="background-color: #f5f5f5; color: #0000ff;">
</span> 17<span style="background-color: #f5f5f5; color: #000000;"> </span> 背景顏色<span style="color: #008080;"></span>:<span style="background-color: #f5f5f5; color: #ff0000;"></span> #A3D5FB<span style="background-color: #f5f5f5; color: #000000;"></span>;<span style="background-color: #f5f5f5; color: #0000ff;">
</span>18<span style="background-color: #f5f5f5; color: #000000;"></span>}</span>
<span style="color: #008080;">19</span>
<span style="color: #008080;"> 20</span> <span style="background-color: #f5f5f5; color: #800000;"> .登入框</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;">21</span><span style="background-color: #f5f5f5; color: #ff0000;">寬度</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">100%</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">22</span><span style="background-color: #f5f5f5; color: #ff0000;">最大寬度</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">400px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">23</span><span style="background-color: #f5f5f5; color: #ff0000;">高度</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">800px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">24</span><span style="background-color: #f5f5f5; color: #ff0000;">位置</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">絕對</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">25</span><span style="background-color: #f5f5f5; color: #ff0000;">頂</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">50%</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;"> 26</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 邊距頂部</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> -300px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">27</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;"> 28</span> <span style="background-color: #f5f5f5; color: #800000;"> .form-group</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;"> 29</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 邊距底部</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 30px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">30</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;"> 31</span> <span style="background-color: #f5f5f5; color: #800000;"> .登入標題</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;"> 32</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 填充</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 20px 10px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;"> 33</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 背景顏色</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> rgba(0,0,0,0.6)
</span><span style="color: #008080;">34</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;"> 35</span> <span style="background-color: #f5f5f5; color: #800000;"> .登入標題小</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;">36</span><span style="background-color: #f5f5f5; color: #ff0000;">顏色</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">#fff</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">37</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;"> 38</span> <span style="background-color: #f5f5f5; color: #800000;"> .登入內容</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;">39</span><span style="background-color: #f5f5f5; color: #ff0000;">高度</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">500px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">40</span><span style="background-color: #f5f5f5; color: #ff0000;">寬度</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">100%</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;"> 41</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 最大寬度</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 600px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;"> 42</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 背景顏色</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> rgba(255,255,255,0.6)</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">43</span><span style="background-color: #f5f5f5; color: #ff0000;">浮動</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">左</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;"> 44</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 填充頂部</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 20px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">45</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;"> 46</span> <span style="background-color: #f5f5f5; color: #800000;"> @media 螢幕和（最小寬度：500px）</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;"> 47</span> <span style="background-color: #f5f5f5; color: #ff0000;"> .login-box {
</span><span style="color: #008080;"> 48</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 剩下</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 50%</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;"> 49</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 左邊距</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> -250px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">50</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;">51</span><span style="background-color: #f5f5f5; color: #800000;">}
</span><span style="color: #008080;"> 52</span><span style="background-color: #f5f5f5; color: #800000;">.btn</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;"> 53</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 填充</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 6px 30px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">54</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;"> 55</span> <span style="background-color: #f5f5f5; color: #800000;"> .輸入組</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;"> 56</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 邊距底部</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 0px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;"> 57</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 邊距</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 0px 0px 30px 0px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">58</span><span style="background-color: #f5f5f5; color: #ff0000;">高度</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">50px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">59</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;"> 60</span> <span style="background-color: #f5f5f5; color: #800000;"> .form-control</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;">61</span><span style="background-color: #f5f5f5; color: #ff0000;">高度</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;">50px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">62</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;"> 63</span> <span style="background-color: #f5f5f5; color: #800000;"> .link p</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;"> 64</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 行高</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 20px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;"> 65</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 邊距頂部</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 30px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">66</span>
<span style="color: #008080;">67</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;"> 68</span> <span style="background-color: #f5f5f5; color: #800000;"> .navbar-btn</span><span style="background-color: #f5f5f5; color: #000000;">{</span>
<span style="color: #008080;"> 69</span> <span style="background-color: #f5f5f5; color: #ff0000;"> 邊距頂部</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #0000ff;"> 0px</span><span style="background-color: #f5f5f5; color: #000000;">;</span>
<span style="color: #008080;">70</span><span style="background-color: #f5f5f5; color: #000000;">}</span>
<span style="color: #008080;">71</span>
<span style="color: #008080;">72</span><span style="color: #0000ff;"></span><span style="color: #800000;">風格</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">73</span>
<span style="color: #008080;">74</span>
<span style="color: #008080;">75</span>
<span style="color: #008080;">76</span>
<span style="color: #008080;">77</span><span style="color: #0000ff;"><span style="color: #800000;">表單</span><span style="color: #ff0000;">方法</span><span style="color: #0000ff;">="post"</span><span style="color: #ff0000;">行動</span><span style="color: #0000ff;">="../php/regist.php"</span><span style="color: #0000ff;">></span><span style="color: #008080;">="../php/regist.php"</span><span style="color: #008080;">></span><span style="color: #0000ff;">="../php/regist.php"</span><span style="color: #800000;">></span><span style="color: #ff0000;">="../php/regist.php"</span><span style="color: #0000ff;">></span><span style="color: #0000ff;">="../php/regist.php"</span><span style="color: #008080;">></span>
<span style="color: #0000ff;">78</span>
<span style="color: #800000;">79</span><span style="color: #ff0000;"><span style="color: #0000ff;">div</span><span style="color: #0000ff;">類</span><span style="color: #008080;">="容器"</span><span style="color: #0000ff;">></span>
<span style="color: #800000;">80</span><span style="color: #ff0000;"><span style="color: #0000ff;">div</span><span style="color: #0000ff;">class</span><span style="color: #008080;">="box"</span><span style="color: #0000ff;">></span>
<span style="color: #800000;">81</span><span style="color: #ff0000;"><span style="color: #0000ff;">div</span><span style="color: #0000ff;">class</span><span style="color: #008080;">="登入框"</span><span style="color: #0000ff;">></span>
<span style="color: #800000;"> 82</span> <span style="color: #0000ff;"><span style="color: #800000;">div </span><span style="color: #0000ff;">class</span><span style="color: #0000ff;">="登入標題文字中心"</span><span style="color: #800000;">></span>
<span style="color: #0000ff;">83</span><span style="color: #800000;"><span style="color: #0000ff;">h1</span><span style="color: #008080;">><span style="color: #0000ff;">小</span><span style="color: #800000;">></span>用戶註冊<span style="color: #0000ff;"></span><span style="color: #008080;">小</span>
<span style="color: #0000ff;">84</span><span style="color: #800000;"></span><span style="color: #ff0000;">div</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;">85</span><span style="color: #008080;"><span style="color: #008000;">div</span><span style="color: #008000;">class</span><span style="color: #008000;">="登入內容"</span><span style="color: #008080;">></span>
<span style="color: #0000ff;">86</span><span style="color: #800000;"><span style="color: #ff0000;">用戶ID</span><span style="color: #0000ff;">--></span>
<span style="color: #0000ff;">87</span><span style="color: #008080;"><span style="color: #0000ff;">div</span><span style="color: #800000;">class</span><span style="color: #ff0000;">="form-group"</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;">88</span><span style="color: #008080;"><span style="color: #0000ff;">div</span><span style="color: #800000;">class</span><span style="color: #ff0000;">="col-md-12"</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;">89</span><span style="color: #008080;"><span style="color: #0000ff;">div</span><span style="color: #800000;">class</span><span style="color: #ff0000;">="input-group"</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"> 90</span> <span style="color: #ff0000;"><span style="color: #ff0000;">span </span><span style="color: #0000ff;">class</span><span style="color: #800000;">="input-group-addon"</span><span style="color: #0000ff;">></span>用<span style="color: #008080;"></span>
<span style="color: #0000ff;"> 91</span> <span style="color: #800000;"><span style="color: #ff0000;">輸入</span><span style="color: #0000ff;">類型</span><span style="color: #ff0000;">="文字"</span><span style="color: #0000ff;">名稱</span>🎜="用戶ID"🎜<span style="color: #ff0000;"> id</span><span style="color: #0000ff;">="userID"</span><span style="color: #ff0000;"> class</span><span style="color: #0000ff;">="form-control"</span><span style="color: #ff0000;"> placeholder</span><span style="color: #0000ff;">="只能為字母和數字，以字母開頭，長度6-10位"</span><span style="color: #0000ff;">="只能為字母和數字，以字母開頭，長度6-10位"</span>><span style="color: #008080;">></span>><span style="color: #0000ff;">></span>><span style="color: #800000;">></span>><span style="color: #0000ff;">></span>><span style="color: #008080;">></span>><span style="color: #0000ff;">></span>><span style="color: #800000;">></span>><span style="color: #0000ff;">></span>><span style="color: #008080;">></span>><span style="color: #0000ff;">></span>><span style="color: #800000;">></span>><span style="color: #0000ff;">></span>><span style="color: #008080;">>
</span> 92<span style="color: #008080;"> </span><span style="color: #008000;"></span>div<span style="color: #008000;"></span>><span style="color: #008000;">
</span> 93<span style="color: #008080;"> </span><span style="color: #0000ff;"></span>div<span style="color: #800000;"></span>><span style="color: #ff0000;">
</span> 94<span style="color: #0000ff;"> </span><span style="color: #0000ff;"></span>div<span style="color: #008080;"></span>><span style="color: #0000ff;">
</span> 95<span style="color: #800000;">
</span> 96<span style="color: #ff0000;"> </span><!--<span style="color: #0000ff;"></span>密碼<span style="color: #0000ff;"></span>--><span style="color: #008080;">
</span> 97<span style="color: #0000ff;"> </span></span>div <span style="color: #ff0000;"></span>class<span style="color: #0000ff;"></span>="form-group"<span style="color: #0000ff;"></span>><span style="color: #008080;">
</span> 98<span style="color: #0000ff;"> </span></span>div <span style="color: #ff0000;"></span>class<span style="color: #0000ff;"></span>="col-md-12"<span style="color: #0000ff;"></span>><span style="color: #ff0000;">
</span> 99<span style="color: #0000ff;"> </span></span>div <span style="color: #0000ff;"></span>class<span style="color: #008080;"></span>="input-group"<span style="color: #0000ff;"></span>><span style="color: #800000;">
</span>100<span style="color: #ff0000;"> </span></span>span <span style="color: #ff0000;"></span>class<span style="color: #0000ff;"></span>="input-group-addon"<span style="color: #ff0000;"></span>><span style="color: #0000ff;">密碼</span>   
<span style="color: #ff0000;">101</span> <span style="color: #0000ff;"><span style="color: #ff0000;">input </span><span style="color: #0000ff;">type</span><span style="color: #0000ff;">="password"</span><span style="color: #008080;"> name</span><span style="color: #0000ff;">="password"</span><span style="color: #800000;"> id </span> placeholder<span style="color: #0000ff;"> </span>="6位以上"<span style="color: #008080;"></span>><span style="color: #0000ff;">
</span>102<span style="color: #800000;"> </span><span style="color: #0000ff;"></span>div<span style="color: #008080;"></span>><span style="color: #0000ff;">
</span>103<span style="color: #800000;"> </span><span style="color: #0000ff;"></span>div<span style="color: #008080;"></span>><span style="color: #008080;">
</span>104<span style="color: #008000;"> </span><span style="color: #008000;"></span>div<span style="color: #008000;"></span>><span style="color: #008080;">
</span>105<span style="color: #0000ff;">
</span>106<span style="color: #800000;"> </span><!--<span style="color: #ff0000;"></span>確認密碼<span style="color: #0000ff;"></span>--><span style="color: #0000ff;">
</span>107<span style="color: #008080;"> </span></span>div <span style="color: #800000;"></span>class<span style="color: #ff0000;"></span>="form-group"<span style="color: #0000ff;"></span>><span style="color: #0000ff;">
</span>108<span style="color: #008080;"> </span>🎜
🎜109🎜<span style="color: #0000ff;"><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="input-group"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">110</span> <span style="color: #0000ff;"><span style="color: #800000;">span </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="input-group-addon"</span><span style="color: #0000ff;">></span>確認密碼<span style="color: #0000ff;"></span>s<span style="color: #800000;">
</span>111<span style="color: #0000ff;"> </span></span>input <span style="color: #0000ff;"></span>type<span style="color: #800000;"></span>="password"<span style="color: #ff0000;"></span> name<span style="color: #0000ff;"></span>="configPassword"<span style="color: #ff0000;"></span> id <span style="color: #0000ff;"></span> placeholder<span style="color: #ff0000;"> </span>="確認密碼"<span style="color: #0000ff;"></span>><span style="color: #ff0000;">
</span>112<span style="color: #0000ff;"> </span><span style="color: #ff0000;"></span>div<span style="color: #0000ff;"></span>><span style="color: #0000ff;">
</span>113<span style="color: #008080;"> </span><span style="color: #0000ff;"></span>div<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>114<span style="color: #008080;"> </span><span style="color: #0000ff;"></span>div<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>115<span style="color: #008080;"> </span><!--<span style="color: #0000ff;"></span>用戶暱稱<span style="color: #800000;"></span>--><span style="color: #0000ff;">
</span>116<span style="color: #008080;"> </span></span>div <span style="color: #008000;"></span>class</span></span></span></span></span></span></span></span></span></span>

登入後複製