JavaWeb_(SSH論壇)_1、項目入門

時間 2019-12-01

標籤 javaweb ssh 論壇項目入門欄目 Java 简体版

原文原文鏈接

基於SSH框架的小型論壇項目　　javascript

　　1、項目入門　　傳送門css

　　2、框架整合　　傳送門html

　　3、用戶模塊　　傳送門前端

　　4、頁面顯示　　傳送門java

　　5、帖子模塊　　傳送門jquery

　　6、點贊模塊　　傳送門git

　　7、輔助模塊　　傳送門github

　　項目已上傳至github：傳送門web

搭建環境後端

　　修改Tomcat部署和web發佈的地址

　　修改字符集

修改Head界面

　　登錄時樣子

　　未登陸時樣子

    <div class="nav-user" style="top:0px;right:100px;">
        
　　
　　　　<!--　　描述：登陸的Style -->
                   
                    <a class="avatar" href="">
                        <img src="res/images/avatar/11.jpg">
                        <cite>Gary</cite>
                    </a>
                    <div class="nav">
                        <a href=""><i class="iconfont icon-tuichu" style="top: 0; font-size: 22px;"></i>退出</a>
                    </div>
                


        <!--　　描述：未登陸的Style
                  
        <a class="iconfont icon-touxiang layui-hide-xs" style="margin-top: 4px; display: inline-block;"> </a>
        <div class="nav" style="font-size: 14px; color: white; margin-top: -5px; margin-left: 1px;" />
        <a href="login.html" target="_parent">登陸</a> <a href="register.html" target="_parent">註冊</a>  -->
    </div>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
    <link rel="stylesheet" type="text/css" href="css/index.css">
</head>


<div class="dvhead">
    <div class="dvlogo"><a href="index.html">你問我答</a></div>
    <div class="dvsearch">10秒鐘註冊帳號，找到你的同窗</div>
    <div class="dvreg">
        已有帳號，當即&nbsp;<a href="login.html">登陸</a>
    </div>
</div>
<div class="dvContent">
    <div class="dvquesleft">

        <div class="dvqstitle">
            <image class="imgbean" src="images/bean.jpg">
            <span class="qsTitle">問答</span>
            <span class="back"><ab  href="">《《返回上一頁</a></span>
        </div>
        <div class="dvtabhead">
            <div class="tabheads tabcurrent">所有問題</div>
            <div class="tabheads">個人問題</div>
            <div class="tabheads">關注問題</div>
            <div class="tabheads">問題標籤</div>
        </div>
        <div class="tabContent">
            <div class="dvtags">
                <a class="curenttag">待解決</a><span class="line"></span><a>高分</a><span
                    class="line"></span><a>新回答</a><span class="line"></span><a>已解決</a>
            </div>
            <div class="tab">
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做之前都是OWC控件在程序中作Excel作操做，主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>

            </div>
            <div class="tab hidden">2</div>
            <div class="tab hidden">3</div>
            <div class="tab hidden">4</div>
        </div>
    </div>
    <div class="dvquesright">
        <div>
            <buton class="btnques" onclick="location.href='add.html'">提個問題</buton>
        </div>
        <div class="dvorder">
            <div class="orderTitle">專家排行榜</div>
            <div class="users">
                <image class="userface" src="images/0.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/1.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/2.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/3.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/4.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/5.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/6.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>


        </div>

    </div>

</div>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
    $(function()
    {

        $(".tabheads").click(function()
        {
            $(".tabheads").removeClass("tabcurrent").eq($(this).index()).addClass("tabcurrent");
            $(".tab").hide().eq($(this).index()).show();
        });
    });
</script>
<body>
</body>
</html>

index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="res/layui/css/layui.css">
<link rel="stylesheet" href="res/css/global.css">
<link rel="stylesheet" type="text/css" href="css/index.css">
<script src="res/layui/layui.js"></script>
<style>
</style>
</head>
<body>
    <div class="dvhead">
    <div class="dvlogo">
        <a href="index.html">你問我答</a>
    </div>
    <div class="dvsearch">10秒鐘註冊帳號，找到你的同窗</div>
    <div class="nav-user" style="top:0px;right:100px;">
        
                   <!--描述：未登陸的樣子 -->
                   
                    <a class="avatar" href="">
                        <img src="res/images/avatar/11.jpg">
                        <cite>賢心</cite>
                    </a>
                    <div class="nav">
                        <a href=""><i class="iconfont icon-tuichu" style="top: 0; font-size: 22px;"></i>退出</a>
                    </div>
                


        <!--
                        描述：未登陸的樣子
                  
        <a class="iconfont icon-touxiang layui-hide-xs" style="margin-top: 4px; display: inline-block;"> </a>
        <div class="nav" style="font-size: 14px; color: white; margin-top: -5px; margin-left: 1px;" />
        <a href="login.html" target="_parent">登陸</a> <a href="register.html" target="_parent">註冊</a>  -->
    </div>
</div>
</body>
</html>

head.html

將iframe應用到其它界面

　　iframe樣式

<body style="margin:-2px">
<iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
　　... ...
</body>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>發表問題</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="css/head.css" />
<link rel="stylesheet" href="layui/css/layui.css">

<link rel="stylesheet" href="css/global.css">

<script src="layui/layui.js"></script>
</head>
<body style="margin: -2px">

    <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>

    <div class="main layui-clear">
        <div class="fly-panel" pad20>
            <h2 class="page-title">發表問題</h2>

            <!-- <div class="fly-none">並沒有權限</div> -->

            <div class="layui-form layui-form-pane">
                <form action=" ">
                    <div class="layui-form-item">
                        <label for="L_title" class="layui-form-label">標題</label>
                        <div class="layui-input-block">
                            <input type="text" id="L_title" name="title" required lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item layui-form-text">
                        <div class="layui-input-block">
                            <div class="editor">
                                <textarea id="content" name="content" style="width: 1040px; height: 450px; visibility: hidden;"></textarea>
                            </div>
                        </div>
                        <label for="L_content" class="layui-form-label" style="top: -2px;">描述</label>
                    </div>
                    <div class="layui-form-item">
                        <label for="L_title" class="layui-form-label">懸賞</label>
                        <div class="layui-input-block">
                            <input type="number" name="reward" required lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <button class="layui-btn" lay-filter="*" lay-submit>當即發佈</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script type="text/javascript" charset="utf-8" src="js/kindeditor.js"></script>
    <script type="text/javascript">
        KE.show({
            id : 'content',
            resizeMode : 1,
            cssPath : './index.css',
            items : [ 'fontname', 'fontsize', 'textcolor', 'bgcolor', 'bold',
                    'italic', 'underline', 'removeformat', 'justifyleft',
                    'justifycenter', 'justifyright', 'insertorderedlist',
                    'insertunorderedlist', 'emoticons', 'image', 'link' ]
        });
    </script>
    <script>
        layui.cache.page = '';
        layui.cache.user = {
            username : '遊客',
            uid : -1,
            avatar : '../res/images/avatar/00.jpg',
            experience : 83,
            sex : '男'
        };
        layui.config({
            version : "2.0.0",
            base : '../res/mods/'
        }).extend({
            fly : 'index'
        }).use('fly');
    </script>
</body>
</html>

add.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>問題詳情</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="keywords" content="fly,layui,前端社區">
<meta name="description" content="">
<link rel="stylesheet" href="res/layui/css/layui.css">
<link rel="stylesheet" href="res/css/global.css">
<script src="res/layui/layui.js"></script>
<script src="js/jquery.js"></script>
<style type="text/css" rel="stylesheet">
form {
    margin: 0;
}

.editor {
    margin-top: 5px;
    margin-bottom: 5px;
}
</style>

</head>
<body style="margin:-2px">
    <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
    <div class="main layui-clear">
        <div class="wrap">
            <div class="content detail">
                <div class="fly-panel detail-box">
                    <h1>帖子標題</h1>
                    <div class="fly-tip fly-detail-hint" data-id="">
                        <span class="fly-tip-stick">置頂帖</span><span class="jie-admin"> <a href="">點擊置頂</a>
                        </span> <span class="layui-btn layui-btn-mini jie-admin"> <a href="">取消置頂</a>
                        </span> <span class="jie-admin" type="del" style="margin-left: 20px;"> <a>刪除該帖</a>
                        </span> </span>
                        <div class="fly-list-hint">
                            <i class="iconfont" title="回答">&#xe60c;</i> 2
                        </div>
                    </div>
                    <div class="detail-about">
                        <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt="頭像"> <cite> 壓縮 <em>2017-05-01發佈</em>
                        </cite>
                        </a>
                        <div class="detail-hits" data-id="{{rows.id}}">
                            <span class="layui-btn layui-btn-mini jie-admin"><a href="#">已完帖，沒法編輯</a> </span> <span class="layui-btn layui-btn-mini jie-admin" type="collect" data-type="add"> <a id="collectPost">收藏</a>
                            </span> <span class="layui-btn layui-btn-mini jie-admin  layui-btn-danger" type="collect" data-type="add"> <a>取消收藏</a>
                            </span>

                        </div>
                    </div>
                    <div class="detail-body photos" style="margin-bottom: 20px;">
                        <p>帖子內容</p>
                    </div>
                </div>
                <div class="fly-panel detail-box" style="padding-top: 0;">
                    <a name="comment"></a>
                    <ul class="jieda photos" id="jieda">
                        <li data-id="12" class="jieda-daan"><a name="item-121212121212"></a>
                            <div class="detail-about detail-about-reply">
                                <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt=""> <cite> <i>紙飛機</i> <!-- <em>(樓主)</em>
                  <em style="color:#5FB878">(管理員)</em> -->
                                </cite>
                                </a>
                                <div class="detail-hits">
                                    <span>3分鐘前</span>
                                </div>
                                <i class="iconfont icon-caina" title="最佳答案"></i>
                            </div>
                            <div class="detail-body jieda-body">
                                <p>麼麼噠</p>
                            </div>
                            <div class="jieda-reply">
                                <span class="jieda-zan zanok" type="zan"><i class="iconfont icon-zan"></i><em>12</em> </span>
                                <!-- <div class="jieda-admin">
                <span type="del">刪除</span>
                <span class="jieda-accept" type="accept">採納</span>
              </div> -->
                            </div></li>
                        <li data-id="13"><a name="item-121212121212"></a>
                            <div class="detail-about detail-about-reply">
                                <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt=""> <cite> <i>香菇</i> <em style="color: #FF9E3F">活雷鋒</em>
                                </cite>
                                </a>
                                <div class="detail-hits">
                                    <span>剛剛</span>
                                </div>
                            </div>
                            <div class="detail-body jieda-body">
                                <p>藍瘦</p>
                            </div>
                            <div class="jieda-reply">
                                <span class="jieda-zan" type="zan"><i class="iconfont icon-zan"></i><em>0</em> </span>
                                <div class="jieda-admin">
                                    <span type="del"><a href="#" class="layui-btn layui-btn-danger layui-btn-small">刪除</a></span> <span class="jieda-accept" type="accept"> <a href="#" class="layui-btn  layui-btn-small">採納</a></span>
                                </div>
                            </div></li>

                        <!-- <li class="fly-none">沒有任何回答</li> -->
                    </ul>
                    <span id="toName">@ 壓縮(樓主)</span>
                    <div class="layui-form layui-form-pane">
                        <form action="">
                            <div class="layui-form-item layui-form-text">
                                <div class="layui-input-block">
                                    <textarea id="L_content" name="content" required lay-verify="required" placeholder="我要回答" class="layui-textarea fly-editor" style="height: 150px;"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <button class="layui-btn" lay-filter="*" lay-submit>提交回答</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>

        <div class="edge">
            <dl class="fly-panel fly-list-one">
                <dt class="fly-panel-title">最近熱帖</dt>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
            </dl>

            <dl class="fly-panel fly-list-one">
                <dt class="fly-panel-title">近期熱議</dt>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
            </dl>
        </div>
    </div>
    <script type="text/javascript" charset="utf-8" src="res/js/kindeditor.js"></script>
    <script type="text/javascript">
        KE.show({
            id : 'L_content',
            resizeMode : 1,
            items : [ 'fontname', 'fontsize', 'textcolor', 'bgcolor', 'bold',
                    'italic', 'underline', 'removeformat', 'justifyleft',
                    'justifycenter', 'justifyright', 'insertorderedlist',
                    'insertunorderedlist', 'emoticons', 'image', 'link' ]
        });
    </script>
</body>
</html>

detail.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
    <link rel="stylesheet" type="text/css" href="css/index.css">
</head>

<body style="margin:-2px">
<iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
<div class="dvContent">
    <div class="dvquesleft">

        <div class="dvqstitle">
            <image class="imgbean" src="images/bean.jpg">
            <span class="qsTitle">問答</span>
            <span class="back"><ab  href="">《《返回上一頁</a></span>
        </div>
        <div class="dvtabhead">
            <div class="tabheads tabcurrent">所有問題</div>
            <div class="tabheads">個人問題</div>
            <div class="tabheads">關注問題</div>
            <div class="tabheads">問題標籤</div>
        </div>
        <div class="tabContent">
            <div class="dvtags">
                <a class="curenttag">待解決</a><span class="line"></span><a>高分</a><span
                    class="line"></span><a>新回答</a><span class="line"></span><a>已解決</a>
            </div>
            <div class="tab">
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做之前都是OWC控件在程序中作Excel作操做，主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>

            </div>
            <div class="tab hidden">2</div>
            <div class="tab hidden">3</div>
            <div class="tab hidden">4</div>
        </div>
    </div>
    <div class="dvquesright">
        <div>
            <buton class="btnques" onclick="location.href='add.html'">提個問題</buton>
        </div>
        <div class="dvorder">
            <div class="orderTitle">專家排行榜</div>
            <div class="users">
                <image class="userface" src="images/0.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/1.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/2.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/3.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/4.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/5.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/6.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>

        </div>

    </div>

</div>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
    $(function()
    {

        $(".tabheads").click(function()
        {
            $(".tabheads").removeClass("tabcurrent").eq($(this).index()).addClass("tabcurrent");
            $(".tab").hide().eq($(this).index()).show();
        });
    });
</script>

</body>
</html>

index.html

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">

<link rel="stylesheet" href="css/head.css" />
<link rel="stylesheet" type="text/css" href="css/login.css" />
</head>

<body style="margin: -2px">

    <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>

    <section class="sec">
        <form action="UserLoginServlet" method="post">
            <div class="register-box">
                <label for="username" class="username_label"> 用 戶 名 <input maxlength="20" name="userName" type="text" placeholder="您的用戶名和登陸名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 設 置 密 碼 <input maxlength="20" type="password" name="pwd" placeholder="建議至少使用兩種字符組合" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 確 認 密 碼 <input maxlength="20" type="password" placeholder="請再次輸入密碼" />
                </label>
                <div class="tips"></div>
            </div>

            <div class="register-box">
                <label for="username" class="other_label"> 驗 證 碼 <input maxlength="20" type="text" placeholder="請輸入驗證碼" />
                </label> <span id="code"></span>
                <div class="tips"></div>
            </div>
            <div class="arguement">
                <input type="checkbox" id="xieyi" /> 閱讀並贊成 <a href="javascript:void(0)">《你問我答用戶註冊協議》</a> <a href="register.html">沒有帳號,當即註冊</a>
                <div class="tips"></div>
            </div>
            <div class="submit_btn">
                <button type="submit" id="submit_btn">立 即 登陸</button>
            </div>
        </form>
    </section>
    <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
</body>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/login.css" />
<link rel="stylesheet" href="css/head.css" />
</head>

<body style="margin: -2px">
<iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
    <section class="sec">
        <form action="UserRegServlet" method="post">
            <div class="register-box">

                <label for="username" class="username_label"> 用 戶 名 <input maxlength="20" name="userName" type="text" placeholder="您的用戶名和登陸名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 設 置 密 碼 <input maxlength="20" type="password" name="pwd" placeholder="建議至少使用兩種字符組合" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 確 認 密 碼 <input maxlength="20" type="password" placeholder="請再次輸入密碼" />
                </label>
                <div class="tips"></div>
            </div>
        
            <div class="register-box">
                <label for="username" class="username_label"> 真實姓名 <input maxlength="20" name="userName" type="text" placeholder="您的真實姓名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="username_label"> 郵箱 <input maxlength="20" name="userName" type="text" placeholder="您的郵箱" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="username_label"> 手機號 <input maxlength="20" name="userName" type="text" placeholder="您的手機號" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="arguement">
                <input type="checkbox" id="xieyi" /> 閱讀並贊成 <a href="javascript:void(0)">《錯題用戶註冊協議》</a> <a href="login.html">已有帳號,當即登陸</a>
                <div class="tips"></div>
            </div>
            <div class="submit_btn">
                <button type="submit" id="submit_btn">立 即 注 冊</button>
            </div>
        </form>
    </section>
    <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>

修改註冊與登錄界面

　　註冊界面

<iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>

    <section class="sec">
        <form action="UserLoginServlet" method="post">
            <div class="register-box">
                <label for="username" class="username_label"> 用 戶 名 <input maxlength="20" name="userName" type="text" placeholder="您的用戶名和登陸名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 密 碼 <input maxlength="20" type="password" name="pwd" placeholder="建議至少使用兩種字符組合" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="arguement">
                <input type="checkbox" id="xieyi" /> 閱讀並贊成 <a href="javascript:void(0)">《你問我答用戶註冊協議》</a> <a href="register.html">沒有帳號,當即註冊</a>
                <div class="tips"></div>
            </div>
            <div class="submit_btn">
                <button type="submit" id="submit_btn">立 即 登陸</button>
            </div>
        </form>
    </section>

　　登錄界面

<iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>

    <section class="sec">
        <form action="UserLoginServlet" method="post">
            <div class="register-box">
                <label for="username" class="username_label"> 用 戶 名 <input maxlength="20" name="userName" type="text" placeholder="您的用戶名和登陸名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 密 碼 <input maxlength="20" type="password" name="pwd" placeholder="建議至少使用兩種字符組合" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="arguement">
                <input type="checkbox" id="xieyi" /> 閱讀並贊成 <a href="javascript:void(0)">《你問我答用戶註冊協議》</a> <a href="register.html">沒有帳號,當即註冊</a>
                <div class="tips"></div>
            </div>
            <div class="submit_btn">
                <button type="submit" id="submit_btn">立 即 登陸</button>
            </div>
        </form>
    </section>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/login.css" />
<link rel="stylesheet" href="css/head.css" />
</head>

<body style="margin: -2px">
<iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
    <section class="sec">
        <form action="UserRegServlet" method="post">
            <div class="register-box">

                <label for="username" class="username_label"> 用 戶 名 <input maxlength="20" name="userName" type="text" placeholder="您的用戶名和登陸名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 設 置 密 碼 <input maxlength="20" type="password" name="pwd" placeholder="建議至少使用兩種字符組合" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 確 認 密 碼 <input maxlength="20" type="password" placeholder="請再次輸入密碼" />
                </label>
                <div class="tips"></div>
            </div>
        
            <div class="register-box">
                <label for="username" class="username_label"> 真實姓名 <input maxlength="20" name="userName" type="text" placeholder="您的真實姓名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="username_label"> 郵箱 <input maxlength="20" name="userName" type="text" placeholder="您的郵箱" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="username_label"> 手機號 <input maxlength="20" name="userName" type="text" placeholder="您的手機號" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="arguement">
                <input type="checkbox" id="xieyi" /> 閱讀並贊成 <a href="javascript:void(0)">《錯題用戶註冊協議》</a> <a href="login.html">已有帳號,當即登陸</a>
                <div class="tips"></div>
            </div>
            <div class="submit_btn">
                <button type="submit" id="submit_btn">立 即 注 冊</button>
            </div>
        </form>
    </section>
    <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">

<link rel="stylesheet" href="css/head.css" />
<link rel="stylesheet" type="text/css" href="css/login.css" />
</head>

<body style="margin: -2px">

    <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>

    <section class="sec">
        <form action="UserLoginServlet" method="post">
            <div class="register-box">
                <label for="username" class="username_label"> 用 戶 名 <input maxlength="20" name="userName" type="text" placeholder="您的用戶名和登陸名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 密 碼 <input maxlength="20" type="password" name="pwd" placeholder="建議至少使用兩種字符組合" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="arguement">
                <input type="checkbox" id="xieyi" /> 閱讀並贊成 <a href="javascript:void(0)">《你問我答用戶註冊協議》</a> <a href="register.html">沒有帳號,當即註冊</a>
                <div class="tips"></div>
            </div>
            <div class="submit_btn">
                <button type="submit" id="submit_btn">立 即 登陸</button>
            </div>
        </form>
    </section>
    <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
</body>

修改主頁(index.html)右側div

　　最近熱帖

<dl class="fly-panel fly-list-one">
                <dt class="fly-panel-title">最近熱帖</dt>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
            </dl>

　　近期熱議

<dl class="fly-panel fly-list-one">
                <dt class="fly-panel-title">近期熱議</dt>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
            </dl>

　　專家排行榜

<div class="orderTitle">專家排行榜</div>
            <div class="users">
                <image class="userface" src="images/0.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/1.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/2.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/3.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/4.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/5.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/6.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <link rel="stylesheet" href="res/css/global.css">
</head>

<body style="margin:-2px">
<iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
<div class="dvContent">
    <div class="dvquesleft">

        <div class="dvqstitle">
            <image class="imgbean" src="images/bean.jpg">
            <span class="qsTitle">問答</span>
            <span class="back"><ab  href="">《《返回上一頁</a></span>
        </div>
        <div class="dvtabhead">
            <div class="tabheads tabcurrent">所有問題</div>
            <div class="tabheads">個人問題</div>
            <div class="tabheads">關注問題</div>
            <div class="tabheads">問題標籤</div>
        </div>
        <div class="tabContent">
            <div class="dvtags">
                <a class="curenttag">待解決</a><span class="line"></span><a>高分</a><span
                    class="line"></span><a>新回答</a><span class="line"></span><a>已解決</a>
            </div>
            <div class="tab">
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做之前都是OWC控件在程序中作Excel作操做，主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="dvques">
                    <div class="quesCount">
                        <div class="count">8</div>
                        <div class="ques">回答數</div>
                    </div>
                    <div class="quesContent">
                        <div class="quesTitle">
                            500
                            <image src="images/bean.jpg" class="bean"> <span
                                class="spanques">Excel開發的問題</span>
                        </div>
                        <div class="qContent">之前都是OWC控件在程序中作Excel作操做，主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                        <div class="tags">
                            <span class="tag">excel</span><span class="tag">程序</span>
                        </div>
                        <div class="quesUser">
                            <image src="images/0.gif" class="imguser" />
                            <div class="userName">
                                張大值
                                <div class="liulan">瀏覽(9) 30分鐘前</div>
                            </div>

                        </div>
                    </div>
                </div>

            </div>
            <div class="tab hidden">2</div>
            <div class="tab hidden">3</div>
            <div class="tab hidden">4</div>
        </div>
    </div>
    <div class="dvquesright">
        <div>
            <buton class="btnques" onclick="location.href='add.html'">提個問題</buton>
        </div>
        
        
        
        <div class="dvorder">
    
            <dl class="fly-panel fly-list-one">
                <dt class="fly-panel-title">最近熱帖</dt>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
            </dl>

            <dl class="fly-panel fly-list-one">
                <dt class="fly-panel-title">近期熱議</dt>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
            </dl>
        
            <div class="orderTitle">專家排行榜</div>
            <div class="users">
                <image class="userface" src="images/0.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/1.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/2.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/3.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/4.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/5.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>
            <div class="users">
                <image class="userface" src="images/6.gif" />
                <div class="dvuser">
                    <div class="userTitle">陳有龍</div>
                    <div class="userdeital">大牛6級 豆:14006</div>
                </div>
            </div>

        </div>
        
    </div>

</div>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
    $(function()
    {

        $(".tabheads").click(function()
        {
            $(".tabheads").removeClass("tabcurrent").eq($(this).index()).addClass("tabcurrent");
            $(".tab").hide().eq($(this).index()).show();
        });
    });
</script>

</body>
</html>

index.html

修改jsp與html自動結構化

　　設置一個標籤佔一行

　　修改Html同時Jsp代碼格式一樣被修改

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>發表問題</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="css/head.css" />
<link rel="stylesheet" href="layui/css/layui.css">

<link rel="stylesheet" href="css/global.css">

<script src="layui/layui.js"></script>
</head>
<body style="margin: -2px">

    <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>

    <div class="main layui-clear">
        <div class="fly-panel" pad20>
            <h2 class="page-title">發表問題</h2>

            <!-- <div class="fly-none">並沒有權限</div> -->

            <div class="layui-form layui-form-pane">
                <form action=" ">
                    <div class="layui-form-item">
                        <label for="L_title" class="layui-form-label">標題</label>
                        <div class="layui-input-block">
                            <input type="text" id="L_title" name="title" required lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item layui-form-text">
                        <div class="layui-input-block">
                            <div class="editor">
                                <textarea id="content" name="content" style="width: 1040px; height: 450px; visibility: hidden;"></textarea>
                            </div>
                        </div>
                        <label for="L_content" class="layui-form-label" style="top: -2px;">描述</label>
                    </div>
                    <div class="layui-form-item">
                        <label for="L_title" class="layui-form-label">懸賞</label>
                        <div class="layui-input-block">
                            <input type="number" name="reward" required lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <button class="layui-btn" lay-filter="*" lay-submit>當即發佈</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script type="text/javascript" charset="utf-8" src="js/kindeditor.js"></script>
    <script type="text/javascript">
        KE.show({
            id : 'content',
            resizeMode : 1,
            cssPath : './index.css',
            items : [ 'fontname', 'fontsize', 'textcolor', 'bgcolor', 'bold',
                    'italic', 'underline', 'removeformat', 'justifyleft',
                    'justifycenter', 'justifyright', 'insertorderedlist',
                    'insertunorderedlist', 'emoticons', 'image', 'link' ]
        });
    </script>
    <script>
        layui.cache.page = '';
        layui.cache.user = {
            username : '遊客',
            uid : -1,
            avatar : '../res/images/avatar/00.jpg',
            experience : 83,
            sex : '男'
        };
        layui.config({
            version : "2.0.0",
            base : '../res/mods/'
        }).extend({
            fly : 'index'
        }).use('fly');
    </script>
</body>
</html>

add.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>問題詳情</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="keywords" content="fly,layui,前端社區">
<meta name="description" content="">
<link rel="stylesheet" href="res/layui/css/layui.css">
<link rel="stylesheet" href="res/css/global.css">
<script src="res/layui/layui.js"></script>
<script src="js/jquery.js"></script>
<style type="text/css" rel="stylesheet">
form {
    margin: 0;
}

.editor {
    margin-top: 5px;
    margin-bottom: 5px;
}
</style>

</head>
<body style="margin: -2px">
    <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
    <div class="main layui-clear">
        <div class="wrap">
            <div class="content detail">
                <div class="fly-panel detail-box">
                    <h1>帖子標題</h1>
                    <div class="fly-tip fly-detail-hint" data-id="">
                        <span class="fly-tip-stick">置頂帖</span><span class="jie-admin"> <a href="">點擊置頂</a>
                        </span> <span class="layui-btn layui-btn-mini jie-admin"> <a href="">取消置頂</a>
                        </span> <span class="jie-admin" type="del" style="margin-left: 20px;"> <a>刪除該帖</a>
                        </span> </span>
                        <div class="fly-list-hint">
                            <i class="iconfont" title="回答">&#xe60c;</i> 2
                        </div>
                    </div>
                    <div class="detail-about">
                        <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt="頭像"> <cite> 壓縮 <em>2017-05-01發佈</em>
                        </cite>
                        </a>
                        <div class="detail-hits" data-id="{{rows.id}}">
                            <span class="layui-btn layui-btn-mini jie-admin"><a href="#">已完帖，沒法編輯</a> </span> <span class="layui-btn layui-btn-mini jie-admin" type="collect" data-type="add"> <a id="collectPost">收藏</a>
                            </span> <span class="layui-btn layui-btn-mini jie-admin  layui-btn-danger" type="collect" data-type="add"> <a>取消收藏</a>
                            </span>

                        </div>
                    </div>
                    <div class="detail-body photos" style="margin-bottom: 20px;">
                        <p>帖子內容</p>
                    </div>
                </div>
                <div class="fly-panel detail-box" style="padding-top: 0;">
                    <a name="comment"></a>
                    <ul class="jieda photos" id="jieda">
                        <li data-id="12" class="jieda-daan"><a name="item-121212121212"></a>
                            <div class="detail-about detail-about-reply">
                                <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt=""> <cite> <i>紙飛機</i> <!-- <em>(樓主)</em>
                  <em style="color:#5FB878">(管理員)</em> -->
                                </cite>
                                </a>
                                <div class="detail-hits">
                                    <span>3分鐘前</span>
                                </div>
                                <i class="iconfont icon-caina" title="最佳答案"></i>
                            </div>
                            <div class="detail-body jieda-body">
                                <p>麼麼噠</p>
                            </div>
                            <div class="jieda-reply">
                                <span class="jieda-zan zanok" type="zan"><i class="iconfont icon-zan"></i><em>12</em> </span>
                                <!-- <div class="jieda-admin">
                <span type="del">刪除</span>
                <span class="jieda-accept" type="accept">採納</span>
              </div> -->
                            </div></li>
                        <li data-id="13"><a name="item-121212121212"></a>
                            <div class="detail-about detail-about-reply">
                                <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt=""> <cite> <i>香菇</i> <em style="color: #FF9E3F">活雷鋒</em>
                                </cite>
                                </a>
                                <div class="detail-hits">
                                    <span>剛剛</span>
                                </div>
                            </div>
                            <div class="detail-body jieda-body">
                                <p>藍瘦</p>
                            </div>
                            <div class="jieda-reply">
                                <span class="jieda-zan" type="zan"><i class="iconfont icon-zan"></i><em>0</em> </span>
                                <div class="jieda-admin">
                                    <span type="del"><a href="#" class="layui-btn layui-btn-danger layui-btn-small">刪除</a></span> <span class="jieda-accept" type="accept"> <a href="#" class="layui-btn  layui-btn-small">採納</a></span>
                                </div>
                            </div></li>

                        <!-- <li class="fly-none">沒有任何回答</li> -->
                    </ul>
                    <span id="toName">@ 壓縮(樓主)</span>
                    <div class="layui-form layui-form-pane">
                        <form action="">
                            <div class="layui-form-item layui-form-text">
                                <div class="layui-input-block">
                                    <textarea id="L_content" name="content" required lay-verify="required" placeholder="我要回答" class="layui-textarea fly-editor" style="height: 150px;"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <button class="layui-btn" lay-filter="*" lay-submit>提交回答</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>

        <div class="edge">
            <dl class="fly-panel fly-list-one">
                <dt class="fly-panel-title">最近熱帖</dt>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局（基本結構）</a> <span><i class="iconfont">&#xe60b;</i> 6087</span>
                </dd>
                <dd>
                    <a href="">Java實現LayIM後端的核心代碼</a> <span><i class="iconfont">&#xe60b;</i> 767</span>
                </dd>
            </dl>

            <dl class="fly-panel fly-list-one">
                <dt class="fly-panel-title">近期熱議</dt>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
                <dd>
                    <a href="">使用 layui 秒搭後臺大布局之基本結構</a> <span><i class="iconfont">&#xe60c;</i> 96</span>
                </dd>
            </dl>
        </div>
    </div>
    <script type="text/javascript" charset="utf-8" src="res/js/kindeditor.js"></script>
    <script type="text/javascript">
        KE.show({
            id : 'L_content',
            resizeMode : 1,
            items : [ 'fontname', 'fontsize', 'textcolor', 'bgcolor', 'bold',
                    'italic', 'underline', 'removeformat', 'justifyleft',
                    'justifycenter', 'justifyright', 'insertorderedlist',
                    'insertunorderedlist', 'emoticons', 'image', 'link' ]
        });
    </script>
</body>
</html>

detail.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="res/layui/css/layui.css">
<link rel="stylesheet" href="res/css/global.css">
<link rel="stylesheet" type="text/css" href="css/index.css">
<script src="res/layui/layui.js"></script>
<style>
</style>
</head>
<body>
    <div class="dvhead">
    <div class="dvlogo">
        <a href="index.html">你問我答</a>
    </div>
    <div class="dvsearch">10秒鐘註冊帳號，找到你的同窗</div>
    <div class="nav-user" style="top:0px;right:100px;">
        
          <!--描述：未登陸的樣子
                   
                    <a class="avatar" href="">
                        <img src="res/images/avatar/11.jpg">
                        <cite>賢心</cite>
                    </a>
                    <div class="nav">
                        <a href=""><i class="iconfont icon-tuichu" style="top: 0; font-size: 22px;"></i>退出</a>
                    </div>
                 -->


        <!--描述：未登陸的樣子-->
                  
        <a class="iconfont icon-touxiang layui-hide-xs" style="margin-top: 4px; display: inline-block;"> </a>
        <div class="nav" style="font-size: 14px; color: white; margin-top: -5px; margin-left: 1px;" />
        <a href="login.html" target="_parent">登陸</a> <a href="register.html" target="_parent">註冊</a>  
    </div>
</div>
</body>
</html>

head.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="css/index.css">
<link rel="stylesheet" href="res/css/global.css">
</head>

<body style="margin: -2px">
    <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
    <div class="dvContent">
        <div class="dvquesleft">

            <div class="dvqstitle">
                <image class="imgbean" src="images/bean.jpg"> <span class="qsTitle">問答</span> <span class="back">
                    <ab href="">《《返回上一頁</a>
                </span>
            </div>
            <div class="dvtabhead">
                <div class="tabheads tabcurrent">所有問題</div>
                <div class="tabheads">個人問題</div>
                <div class="tabheads">關注問題</div>
                <div class="tabheads">問題標籤</div>
            </div>
            <div class="tabContent">
                <div class="dvtags">
                    <a class="curenttag">待解決</a>
                    <span class="line"></span>
                    <a>高分</a>
                    <span class="line"></span>
                    <a>新回答</a>
                    <span class="line"></span>
                    <a>已解決</a>
                </div>
                <div class="tab">
                    <div class="dvques">
                        <div class="quesCount">
                            <div class="count">8</div>
                            <div class="ques">回答數</div>
                        </div>
                        <div class="quesContent">
                            <div class="quesTitle">
                                500
                                <image src="images/bean.jpg" class="bean"> <span class="spanques">Excel開發的問題</span>
                            </div>
                            <div class="qContent">之前都是OWC控件在程序中作Excel作操做之前都是OWC控件在程序中作Excel作操做，主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                            <div class="tags">
                                <span class="tag">excel</span>
                                <span class="tag">程序</span>
                            </div>
                            <div class="quesUser">
                                <image src="images/0.gif" class="imguser" />
                                <div class="userName">
                                    張大值
                                    <div class="liulan">瀏覽(9) 30分鐘前</div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="dvques">
                        <div class="quesCount">
                            <div class="count">8</div>
                            <div class="ques">回答數</div>
                        </div>
                        <div class="quesContent">
                            <div class="quesTitle">
                                500
                                <image src="images/bean.jpg" class="bean"> <span class="spanques">Excel開發的問題</span>
                            </div>
                            <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                            <div class="tags">
                                <span class="tag">excel</span>
                                <span class="tag">程序</span>
                            </div>
                            <div class="quesUser">
                                <image src="images/0.gif" class="imguser" />
                                <div class="userName">
                                    張大值
                                    <div class="liulan">瀏覽(9) 30分鐘前</div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="dvques">
                        <div class="quesCount">
                            <div class="count">8</div>
                            <div class="ques">回答數</div>
                        </div>
                        <div class="quesContent">
                            <div class="quesTitle">
                                500
                                <image src="images/bean.jpg" class="bean"> <span class="spanques">Excel開發的問題</span>
                            </div>
                            <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                            <div class="tags">
                                <span class="tag">excel</span>
                                <span class="tag">程序</span>
                            </div>
                            <div class="quesUser">
                                <image src="images/0.gif" class="imguser" />
                                <div class="userName">
                                    張大值
                                    <div class="liulan">瀏覽(9) 30分鐘前</div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="dvques">
                        <div class="quesCount">
                            <div class="count">8</div>
                            <div class="ques">回答數</div>
                        </div>
                        <div class="quesContent">
                            <div class="quesTitle">
                                500
                                <image src="images/bean.jpg" class="bean"> <span class="spanques">Excel開發的問題</span>
                            </div>
                            <div class="qContent">之前都是OWC控件在程序中作Excel作操做，之前都是OWC控件在程序中作Excel作操做主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                            <div class="tags">
                                <span class="tag">excel</span>
                                <span class="tag">程序</span>
                            </div>
                            <div class="quesUser">
                                <image src="images/0.gif" class="imguser" />
                                <div class="userName">
                                    張大值
                                    <div class="liulan">瀏覽(9) 30分鐘前</div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="dvques">
                        <div class="quesCount">
                            <div class="count">8</div>
                            <div class="ques">回答數</div>
                        </div>
                        <div class="quesContent">
                            <div class="quesTitle">
                                500
                                <image src="images/bean.jpg" class="bean"> <span class="spanques">Excel開發的問題</span>
                            </div>
                            <div class="qContent">之前都是OWC控件在程序中作Excel作操做，主要包裹之前裹作Excel作操做，主要包裹之前都是OWC控件在程序中作Excel作操做，主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...主要包裹主要包裹之前都是主要包中作Excel作操做，主要包裹，主要包裹...</div>
                            <div class="tags">
                                <span class="tag">excel</span>
                                <span class="tag">程序</span>
                            </div>
                            <div class="quesUser">
                                <image src="images/0.gif" class="imguser" />
                                <div class="userName">
                                    張大值
                                    <div class="liulan">瀏覽(9) 30分鐘前</div>
                                </div>

                            </div>
                        </div>
                    </div>

                </div>
                <div class="tab hidden">2</div>
                <div class="tab hidden">3</div>
                <div class="tab hidden">4</div>
            </div>
        </div>
        <div class="dvquesright">
            <div>
                <buton class="btnques" onclick="location.href='add.html'">提個問題</buton>
            </div>



            <div class="dvorder">

                <dl class="fly-panel fly-list-one">
                    <dt class="fly-panel-title">最近熱帖</dt>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局（基本結構）</a>
                        <span>
                            <i class="iconfont">&#xe60b;</i>
                            6087
                        </span>
                    </dd>
                    <dd>
                        <a href="">Java實現LayIM後端的核心代碼</a>
                        <span>
                            <i class="iconfont">&#xe60b;</i>
                            767
                        </span>
                    </dd>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局（基本結構）</a>
                        <span>
                            <i class="iconfont">&#xe60b;</i>
                            6087
                        </span>
                    </dd>
                    <dd>
                        <a href="">Java實現LayIM後端的核心代碼</a>
                        <span>
                            <i class="iconfont">&#xe60b;</i>
                            767
                        </span>
                    </dd>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局（基本結構）</a>
                        <span>
                            <i class="iconfont">&#xe60b;</i>
                            6087
                        </span>
                    </dd>
                    <dd>
                        <a href="">Java實現LayIM後端的核心代碼</a>
                        <span>
                            <i class="iconfont">&#xe60b;</i>
                            767
                        </span>
                    </dd>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局（基本結構）</a>
                        <span>
                            <i class="iconfont">&#xe60b;</i>
                            6087
                        </span>
                    </dd>
                    <dd>
                        <a href="">Java實現LayIM後端的核心代碼</a>
                        <span>
                            <i class="iconfont">&#xe60b;</i>
                            767
                        </span>
                    </dd>
                </dl>

                <dl class="fly-panel fly-list-one">
                    <dt class="fly-panel-title">近期熱議</dt>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局之基本結構</a>
                        <span>
                            <i class="iconfont">&#xe60c;</i>
                            96
                        </span>
                    </dd>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局之基本結構</a>
                        <span>
                            <i class="iconfont">&#xe60c;</i>
                            96
                        </span>
                    </dd>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局之基本結構</a>
                        <span>
                            <i class="iconfont">&#xe60c;</i>
                            96
                        </span>
                    </dd>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局之基本結構</a>
                        <span>
                            <i class="iconfont">&#xe60c;</i>
                            96
                        </span>
                    </dd>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局之基本結構</a>
                        <span>
                            <i class="iconfont">&#xe60c;</i>
                            96
                        </span>
                    </dd>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局之基本結構</a>
                        <span>
                            <i class="iconfont">&#xe60c;</i>
                            96
                        </span>
                    </dd>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局之基本結構</a>
                        <span>
                            <i class="iconfont">&#xe60c;</i>
                            96
                        </span>
                    </dd>
                    <dd>
                        <a href="">使用 layui 秒搭後臺大布局之基本結構</a>
                        <span>
                            <i class="iconfont">&#xe60c;</i>
                            96
                        </span>
                    </dd>
                </dl>

                <div class="orderTitle">專家排行榜</div>
                <div class="users">
                    <image class="userface" src="images/0.gif" />
                    <div class="dvuser">
                        <div class="userTitle">陳有龍</div>
                        <div class="userdeital">大牛6級 豆:14006</div>
                    </div>
                </div>
                <div class="users">
                    <image class="userface" src="images/1.gif" />
                    <div class="dvuser">
                        <div class="userTitle">陳有龍</div>
                        <div class="userdeital">大牛6級 豆:14006</div>
                    </div>
                </div>
                <div class="users">
                    <image class="userface" src="images/2.gif" />
                    <div class="dvuser">
                        <div class="userTitle">陳有龍</div>
                        <div class="userdeital">大牛6級 豆:14006</div>
                    </div>
                </div>
                <div class="users">
                    <image class="userface" src="images/3.gif" />
                    <div class="dvuser">
                        <div class="userTitle">陳有龍</div>
                        <div class="userdeital">大牛6級 豆:14006</div>
                    </div>
                </div>
                <div class="users">
                    <image class="userface" src="images/4.gif" />
                    <div class="dvuser">
                        <div class="userTitle">陳有龍</div>
                        <div class="userdeital">大牛6級 豆:14006</div>
                    </div>
                </div>
                <div class="users">
                    <image class="userface" src="images/5.gif" />
                    <div class="dvuser">
                        <div class="userTitle">陳有龍</div>
                        <div class="userdeital">大牛6級 豆:14006</div>
                    </div>
                </div>
                <div class="users">
                    <image class="userface" src="images/6.gif" />
                    <div class="dvuser">
                        <div class="userTitle">陳有龍</div>
                        <div class="userdeital">大牛6級 豆:14006</div>
                    </div>
                </div>

            </div>

        </div>

    </div>
    <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript">
        $(function() {

            $(".tabheads").click(
                    function() {
                        $(".tabheads").removeClass("tabcurrent").eq(
                                $(this).index()).addClass("tabcurrent");
                        $(".tab").hide().eq($(this).index()).show();
                    });
        });
    </script>

</body>
</html>

index.html

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">

<link rel="stylesheet" href="css/head.css" />
<link rel="stylesheet" type="text/css" href="css/login.css" />
</head>

<body style="margin: -2px">

    <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>

    <section class="sec">
        <form action="UserLoginServlet" method="post">
            <div class="register-box">
                <label for="username" class="username_label"> 用 戶 名 <input maxlength="20" name="userName" type="text" placeholder="您的用戶名和登陸名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 密 碼 <input maxlength="20" type="password" name="pwd" placeholder="建議至少使用兩種字符組合" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="arguement">
                <input type="checkbox" id="xieyi" /> 閱讀並贊成 <a href="javascript:void(0)">《你問我答用戶註冊協議》</a> <a href="register.html">沒有帳號,當即註冊</a>
                <div class="tips"></div>
            </div>
            <div class="submit_btn">
                <button type="submit" id="submit_btn">立 即 登陸</button>
            </div>
        </form>
    </section>
    <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
</body>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/login.css" />
<link rel="stylesheet" href="css/head.css" />
</head>

<body style="margin: -2px">
<iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
    <section class="sec">
        <form action="UserRegServlet" method="post">
            <div class="register-box">

                <label for="username" class="username_label"> 用 戶 名 <input maxlength="20" name="userName" type="text" placeholder="您的用戶名和登陸名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 設 置 密 碼 <input maxlength="20" type="password" name="pwd" placeholder="建議至少使用兩種字符組合" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="other_label"> 確 認 密 碼 <input maxlength="20" type="password" placeholder="請再次輸入密碼" />
                </label>
                <div class="tips"></div>
            </div>
        
            <div class="register-box">
                <label for="username" class="username_label"> 真實姓名 <input maxlength="20" name="userName" type="text" placeholder="您的真實姓名" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="username_label"> 郵箱 <input maxlength="20" name="userName" type="text" placeholder="您的郵箱" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="register-box">
                <label for="username" class="username_label"> 手機號 <input maxlength="20" name="userName" type="text" placeholder="您的手機號" />
                </label>
                <div class="tips"></div>
            </div>
            <div class="arguement">
                <input type="checkbox" id="xieyi" /> 閱讀並贊成 <a href="javascript:void(0)">《錯題用戶註冊協議》</a> <a href="login.html">已有帳號,當即登陸</a>
                <div class="tips"></div>
            </div>
            <div class="submit_btn">
                <button type="submit" id="submit_btn">立 即 注 冊</button>
            </div>
        </form>
    </section>
    <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。