基于SSH框架的小型论坛项目　　

　　一、项目入门　　传送门

　　二、框架整合　　传送门

　　三、用户模块　　传送门

　　四、页面显示　　传送门

　　五、帖子模块　　传送门

　　六、点赞模块　　传送门

　　七、辅助模块　　传送门

　　项目已上传至github：传送门

搭建环境

　　修改Tomcat部署和web发布的地址

　　修改字符集

修改Head界面

　　登陆时样子

　　未登录时样子

  1.     <div class="nav-user" style="top:0px;right:100px;">
  2.         
    　　
    　　　　<!--　　描述：登录的Style -->
  3.  
  4.                     <a class="avatar" href="">
  5.                         <img src="res/images/avatar/11.jpg">
  6.                         <cite>Gary</cite>
  7.                     </a>
  8.                     <div class="nav">
  9.                         <a href=""><i class="iconfont icon-tuichu" style="top: 0; font-size: 22px;"></i>退出</a>
  10.                     </div>
  11.  
  12.         <!--　　描述：未登录的Style
  13.  
  14.         <a class="iconfont icon-touxiang layui-hide-xs" style="margin-top: 4px; display: inline-block;"> </a>
  15.         <div class="nav" style="font-size: 14px; color: white; margin-top: -5px; margin-left: 1px;" />
  16.         <a href="login.html" target="_parent">登录</a> <a href="register.html" target="_parent">注册</a>  -->
  17.     </div>
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="utf-8" />
  5.     <link rel="stylesheet" type="text/css" href="css/index.css">
  6. </head>
  7.  
  8. <div class="dvhead">
  9.     <div class="dvlogo"><a href="index.html">你问我答</a></div>
  10.     <div class="dvsearch">10秒钟注册账号，找到你的同学</div>
  11.     <div class="dvreg">
  12.         已有账号，立即&nbsp;<a href="login.html">登录</a>
  13.     </div>
  14. </div>
  15. <div class="dvContent">
  16.     <div class="dvquesleft">
  17.  
  18.         <div class="dvqstitle">
  19.             <image class="imgbean" src="data:images/bean.jpg">
  20.             <span class="qsTitle">问答</span>
  21.             <span class="back"><ab  href="">《《返回上一页</a></span>
  22.         </div>
  23.         <div class="dvtabhead">
  24.             <div class="tabheads tabcurrent">全部问题</div>
  25.             <div class="tabheads">我的问题</div>
  26.             <div class="tabheads">关注问题</div>
  27.             <div class="tabheads">问题标签</div>
  28.         </div>
  29.         <div class="tabContent">
  30.             <div class="dvtags">
  31.                 <a class="curenttag">待解决</a><span class="line"></span><a>高分</a><span
  32.                     class="line"></span><a>新回答</a><span class="line"></span><a>已解决</a>
  33.             </div>
  34.             <div class="tab">
  35.                 <div class="dvques">
  36.                     <div class="quesCount">
  37.                         <div class="count">8</div>
  38.                         <div class="ques">回答数</div>
  39.                     </div>
  40.                     <div class="quesContent">
  41.                         <div class="quesTitle">
  42.                             500
  43.                             <image src="data:images/bean.jpg" class="bean"> <span
  44.                                 class="spanques">Excel开发的问题</span>
  45.                         </div>
  46.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作以前都是OWC控件在程序中做Excel做操作，主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  47.                         <div class="tags">
  48.                             <span class="tag">excel</span><span class="tag">程序</span>
  49.                         </div>
  50.                         <div class="quesUser">
  51.                             <image src="data:images/0.gif" class="imguser" />
  52.                             <div class="userName">
  53.                                 张大值
  54.                                 <div class="liulan">浏览(9) 30分钟前</div>
  55.                             </div>
  56.  
  57.                         </div>
  58.                     </div>
  59.                 </div>
  60.                 <div class="dvques">
  61.                     <div class="quesCount">
  62.                         <div class="count">8</div>
  63.                         <div class="ques">回答数</div>
  64.                     </div>
  65.                     <div class="quesContent">
  66.                         <div class="quesTitle">
  67.                             500
  68.                             <image src="data:images/bean.jpg" class="bean"> <span
  69.                                 class="spanques">Excel开发的问题</span>
  70.                         </div>
  71.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  72.                         <div class="tags">
  73.                             <span class="tag">excel</span><span class="tag">程序</span>
  74.                         </div>
  75.                         <div class="quesUser">
  76.                             <image src="data:images/0.gif" class="imguser" />
  77.                             <div class="userName">
  78.                                 张大值
  79.                                 <div class="liulan">浏览(9) 30分钟前</div>
  80.                             </div>
  81.  
  82.                         </div>
  83.                     </div>
  84.                 </div>
  85.                 <div class="dvques">
  86.                     <div class="quesCount">
  87.                         <div class="count">8</div>
  88.                         <div class="ques">回答数</div>
  89.                     </div>
  90.                     <div class="quesContent">
  91.                         <div class="quesTitle">
  92.                             500
  93.                             <image src="data:images/bean.jpg" class="bean"> <span
  94.                                 class="spanques">Excel开发的问题</span>
  95.                         </div>
  96.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  97.                         <div class="tags">
  98.                             <span class="tag">excel</span><span class="tag">程序</span>
  99.                         </div>
  100.                         <div class="quesUser">
  101.                             <image src="data:images/0.gif" class="imguser" />
  102.                             <div class="userName">
  103.                                 张大值
  104.                                 <div class="liulan">浏览(9) 30分钟前</div>
  105.                             </div>
  106.  
  107.                         </div>
  108.                     </div>
  109.                 </div>
  110.                 <div class="dvques">
  111.                     <div class="quesCount">
  112.                         <div class="count">8</div>
  113.                         <div class="ques">回答数</div>
  114.                     </div>
  115.                     <div class="quesContent">
  116.                         <div class="quesTitle">
  117.                             500
  118.                             <image src="data:images/bean.jpg" class="bean"> <span
  119.                                 class="spanques">Excel开发的问题</span>
  120.                         </div>
  121.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  122.                         <div class="tags">
  123.                             <span class="tag">excel</span><span class="tag">程序</span>
  124.                         </div>
  125.                         <div class="quesUser">
  126.                             <image src="data:images/0.gif" class="imguser" />
  127.                             <div class="userName">
  128.                                 张大值
  129.                                 <div class="liulan">浏览(9) 30分钟前</div>
  130.                             </div>
  131.  
  132.                         </div>
  133.                     </div>
  134.                 </div>
  135.                 <div class="dvques">
  136.                     <div class="quesCount">
  137.                         <div class="count">8</div>
  138.                         <div class="ques">回答数</div>
  139.                     </div>
  140.                     <div class="quesContent">
  141.                         <div class="quesTitle">
  142.                             500
  143.                             <image src="data:images/bean.jpg" class="bean"> <span
  144.                                 class="spanques">Excel开发的问题</span>
  145.                         </div>
  146.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  147.                         <div class="tags">
  148.                             <span class="tag">excel</span><span class="tag">程序</span>
  149.                         </div>
  150.                         <div class="quesUser">
  151.                             <image src="data:images/0.gif" class="imguser" />
  152.                             <div class="userName">
  153.                                 张大值
  154.                                 <div class="liulan">浏览(9) 30分钟前</div>
  155.                             </div>
  156.  
  157.                         </div>
  158.                     </div>
  159.                 </div>
  160.  
  161.             </div>
  162.             <div class="tab hidden">2</div>
  163.             <div class="tab hidden">3</div>
  164.             <div class="tab hidden">4</div>
  165.         </div>
  166.     </div>
  167.     <div class="dvquesright">
  168.         <div>
  169.             <buton class="btnques" onclick="location.href='add.html'">提个问题</buton>
  170.         </div>
  171.         <div class="dvorder">
  172.             <div class="orderTitle">专家排行榜</div>
  173.             <div class="users">
  174.                 <image class="userface" src="data:images/0.gif" />
  175.                 <div class="dvuser">
  176.                     <div class="userTitle">陈有龙</div>
  177.                     <div class="userdeital">大牛6级 豆:14006</div>
  178.                 </div>
  179.             </div>
  180.             <div class="users">
  181.                 <image class="userface" src="data:images/1.gif" />
  182.                 <div class="dvuser">
  183.                     <div class="userTitle">陈有龙</div>
  184.                     <div class="userdeital">大牛6级 豆:14006</div>
  185.                 </div>
  186.             </div>
  187.             <div class="users">
  188.                 <image class="userface" src="data:images/2.gif" />
  189.                 <div class="dvuser">
  190.                     <div class="userTitle">陈有龙</div>
  191.                     <div class="userdeital">大牛6级 豆:14006</div>
  192.                 </div>
  193.             </div>
  194.             <div class="users">
  195.                 <image class="userface" src="data:images/3.gif" />
  196.                 <div class="dvuser">
  197.                     <div class="userTitle">陈有龙</div>
  198.                     <div class="userdeital">大牛6级 豆:14006</div>
  199.                 </div>
  200.             </div>
  201.             <div class="users">
  202.                 <image class="userface" src="data:images/4.gif" />
  203.                 <div class="dvuser">
  204.                     <div class="userTitle">陈有龙</div>
  205.                     <div class="userdeital">大牛6级 豆:14006</div>
  206.                 </div>
  207.             </div>
  208.             <div class="users">
  209.                 <image class="userface" src="data:images/5.gif" />
  210.                 <div class="dvuser">
  211.                     <div class="userTitle">陈有龙</div>
  212.                     <div class="userdeital">大牛6级 豆:14006</div>
  213.                 </div>
  214.             </div>
  215.             <div class="users">
  216.                 <image class="userface" src="data:images/6.gif" />
  217.                 <div class="dvuser">
  218.                     <div class="userTitle">陈有龙</div>
  219.                     <div class="userdeital">大牛6级 豆:14006</div>
  220.                 </div>
  221.             </div>
  222.  
  223.         </div>
  224.  
  225.     </div>
  226.  
  227. </div>
  228. <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
  229. <script type="text/javascript">
  230.     $(function()
  231.     {
  232.  
  233.         $(".tabheads").click(function()
  234.         {
  235.             $(".tabheads").removeClass("tabcurrent").eq($(this).index()).addClass("tabcurrent");
  236.             $(".tab").hide().eq($(this).index()).show();
  237.         });
  238.     });
  239. </script>
  240. <body>
  241. </body>
  242. </html>

index.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <link rel="stylesheet" href="res/layui/css/layui.css">
  7. <link rel="stylesheet" href="res/css/global.css">
  8. <link rel="stylesheet" type="text/css" href="css/index.css">
  9. <script src="res/layui/layui.js"></script>
  10. <style>
  11. </style>
  12. </head>
  13. <body>
  14.     <div class="dvhead">
  15.     <div class="dvlogo">
  16.         <a href="index.html">你问我答</a>
  17.     </div>
  18.     <div class="dvsearch">10秒钟注册账号，找到你的同学</div>
  19.     <div class="nav-user" style="top:0px;right:100px;">
  20.  
  21.                    <!--描述：未登录的样子 -->
  22.  
  23.                     <a class="avatar" href="">
  24.                         <img src="res/images/avatar/11.jpg">
  25.                         <cite>贤心</cite>
  26.                     </a>
  27.                     <div class="nav">
  28.                         <a href=""><i class="iconfont icon-tuichu" style="top: 0; font-size: 22px;"></i>退出</a>
  29.                     </div>
  30.  
  31.         <!--
  32.                         描述：未登录的样子
  33.  
  34.         <a class="iconfont icon-touxiang layui-hide-xs" style="margin-top: 4px; display: inline-block;"> </a>
  35.         <div class="nav" style="font-size: 14px; color: white; margin-top: -5px; margin-left: 1px;" />
  36.         <a href="login.html" target="_parent">登录</a> <a href="register.html" target="_parent">注册</a>  -->
  37.     </div>
  38. </div>
  39. </body>
  40. </html>

head.html

将iframe应用到其它界面

　　iframe样式

  1. <body style="margin:-2px">
  2. <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  3. 　　... ...
  4. </body>
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>发表问题</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  7. <link rel="stylesheet" href="css/head.css" />
  8. <link rel="stylesheet" href="layui/css/layui.css">
  9.  
  10. <link rel="stylesheet" href="css/global.css">
  11.  
  12. <script src="layui/layui.js"></script>
  13. </head>
  14. <body style="margin: -2px">
  15.  
  16.     <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  17.  
  18.     <div class="main layui-clear">
  19.         <div class="fly-panel" pad20>
  20.             <h2 class="page-title">发表问题</h2>
  21.  
  22.             <!-- <div class="fly-none">并无权限</div> -->
  23.  
  24.             <div class="layui-form layui-form-pane">
  25.                 <form action=" ">
  26.                     <div class="layui-form-item">
  27.                         <label for="L_title" class="layui-form-label">标题</label>
  28.                         <div class="layui-input-block">
  29.                             <input type="text" id="L_title" name="title" required lay-verify="required" autocomplete="off" class="layui-input">
  30.                         </div>
  31.                     </div>
  32.                     <div class="layui-form-item layui-form-text">
  33.                         <div class="layui-input-block">
  34.                             <div class="editor">
  35.                                 <textarea id="content" name="content" style="width: 1040px; height: 450px; visibility: hidden;"></textarea>
  36.                             </div>
  37.                         </div>
  38.                         <label for="L_content" class="layui-form-label" style="top: -2px;">描述</label>
  39.                     </div>
  40.                     <div class="layui-form-item">
  41.                         <label for="L_title" class="layui-form-label">悬赏</label>
  42.                         <div class="layui-input-block">
  43.                             <input type="number" name="reward" required lay-verify="required" autocomplete="off" class="layui-input">
  44.                         </div>
  45.                     </div>
  46.                     <div class="layui-form-item">
  47.                         <button class="layui-btn" lay-filter="*" lay-submit>立即发布</button>
  48.                     </div>
  49.                 </form>
  50.             </div>
  51.         </div>
  52.     </div>
  53.  
  54.     <script type="text/javascript" charset="utf-8" src="js/kindeditor.js"></script>
  55.     <script type="text/javascript">
  56.         KE.show({
  57.             id : 'content',
  58.             resizeMode : 1,
  59.             cssPath : './index.css',
  60.             items : [ 'fontname', 'fontsize', 'textcolor', 'bgcolor', 'bold',
  61.                     'italic', 'underline', 'removeformat', 'justifyleft',
  62.                     'justifycenter', 'justifyright', 'insertorderedlist',
  63.                     'insertunorderedlist', 'emoticons', 'image', 'link' ]
  64.         });
  65.     </script>
  66.     <script>
  67.         layui.cache.page = '';
  68.         layui.cache.user = {
  69.             username : '游客',
  70.             uid : -1,
  71.             avatar : '../res/images/avatar/00.jpg',
  72.             experience : 83,
  73.             sex : '男'
  74.         };
  75.         layui.config({
  76.             version : "2.0.0",
  77.             base : '../res/mods/'
  78.         }).extend({
  79.             fly : 'index'
  80.         }).use('fly');
  81.     </script>
  82. </body>
  83. </html>

add.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>问题详情</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  7. <meta name="keywords" content="fly,layui,前端社区">
  8. <meta name="description" content="">
  9. <link rel="stylesheet" href="res/layui/css/layui.css">
  10. <link rel="stylesheet" href="res/css/global.css">
  11. <script src="res/layui/layui.js"></script>
  12. <script src="js/jquery.js"></script>
  13. <style type="text/css" rel="stylesheet">
  14. form {
  15.     margin: 0;
  16. }
  17.  
  18. .editor {
  19.     margin-top: 5px;
  20.     margin-bottom: 5px;
  21. }
  22. </style>
  23.  
  24. </head>
  25. <body style="margin:-2px">
  26.     <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  27.     <div class="main layui-clear">
  28.         <div class="wrap">
  29.             <div class="content detail">
  30.                 <div class="fly-panel detail-box">
  31.                     <h1>帖子标题</h1>
  32.                     <div class="fly-tip fly-detail-hint" data-id="">
  33.                         <span class="fly-tip-stick">置顶帖</span><span class="jie-admin"> <a href="">点击置顶</a>
  34.                         </span> <span class="layui-btn layui-btn-mini jie-admin"> <a href="">取消置顶</a>
  35.                         </span> <span class="jie-admin" type="del" style="margin-left: 20px;"> <a>删除该帖</a>
  36.                         </span> </span>
  37.                         <div class="fly-list-hint">
  38.                             <i class="iconfont" title="回答"></i> 2
  39.                         </div>
  40.                     </div>
  41.                     <div class="detail-about">
  42.                         <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt="头像"> <cite> 压缩 <em>2017-05-01发布</em>
  43.                         </cite>
  44.                         </a>
  45.                         <div class="detail-hits" data-id="{{rows.id}}">
  46.                             <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>
  47.                             </span> <span class="layui-btn layui-btn-mini jie-admin  layui-btn-danger" type="collect" data-type="add"> <a>取消收藏</a>
  48.                             </span>
  49.  
  50.                         </div>
  51.                     </div>
  52.                     <div class="detail-body photos" style="margin-bottom: 20px;">
  53.                         <p>帖子内容</p>
  54.                     </div>
  55.                 </div>
  56.                 <div class="fly-panel detail-box" style="padding-top: 0;">
  57.                     <a name="comment"></a>
  58.                     <ul class="jieda photos" id="jieda">
  59.                         <li data-id="12" class="jieda-daan"><a name="item-121212121212"></a>
  60.                             <div class="detail-about detail-about-reply">
  61.                                 <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt=""> <cite> <i>纸飞机</i> <!-- <em>(楼主)</em>
  62.                   <em style="color:#5FB878">(管理员)</em> -->
  63.                                 </cite>
  64.                                 </a>
  65.                                 <div class="detail-hits">
  66.                                     <span>3分钟前</span>
  67.                                 </div>
  68.                                 <i class="iconfont icon-caina" title="最佳答案"></i>
  69.                             </div>
  70.                             <div class="detail-body jieda-body">
  71.                                 <p>么么哒</p>
  72.                             </div>
  73.                             <div class="jieda-reply">
  74.                                 <span class="jieda-zan zanok" type="zan"><i class="iconfont icon-zan"></i><em>12</em> </span>
  75.                                 <!-- <div class="jieda-admin">
  76.                 <span type="del">删除</span>
  77.                 <span class="jieda-accept" type="accept">采纳</span>
  78.               </div> -->
  79.                             </div></li>
  80.                         <li data-id="13"><a name="item-121212121212"></a>
  81.                             <div class="detail-about detail-about-reply">
  82.                                 <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt=""> <cite> <i>香菇</i> <em style="color: #FF9E3F">活雷锋</em>
  83.                                 </cite>
  84.                                 </a>
  85.                                 <div class="detail-hits">
  86.                                     <span>刚刚</span>
  87.                                 </div>
  88.                             </div>
  89.                             <div class="detail-body jieda-body">
  90.                                 <p>蓝瘦</p>
  91.                             </div>
  92.                             <div class="jieda-reply">
  93.                                 <span class="jieda-zan" type="zan"><i class="iconfont icon-zan"></i><em>0</em> </span>
  94.                                 <div class="jieda-admin">
  95.                                     <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>
  96.                                 </div>
  97.                             </div></li>
  98.  
  99.                         <!-- <li class="fly-none">没有任何回答</li> -->
  100.                     </ul>
  101.                     <span id="toName">@ 压缩(楼主)</span>
  102.                     <div class="layui-form layui-form-pane">
  103.                         <form action="">
  104.                             <div class="layui-form-item layui-form-text">
  105.                                 <div class="layui-input-block">
  106.                                     <textarea id="L_content" name="content" required lay-verify="required" placeholder="我要回答" class="layui-textarea fly-editor" style="height: 150px;"></textarea>
  107.                                 </div>
  108.                             </div>
  109.                             <div class="layui-form-item">
  110.                                 <button class="layui-btn" lay-filter="*" lay-submit>提交回答</button>
  111.                             </div>
  112.                         </form>
  113.                     </div>
  114.                 </div>
  115.             </div>
  116.         </div>
  117.  
  118.         <div class="edge">
  119.             <dl class="fly-panel fly-list-one">
  120.                 <dt class="fly-panel-title">最近热帖</dt>
  121.                 <dd>
  122.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  123.                 </dd>
  124.                 <dd>
  125.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  126.                 </dd>
  127.                 <dd>
  128.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  129.                 </dd>
  130.                 <dd>
  131.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  132.                 </dd>
  133.                 <dd>
  134.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  135.                 </dd>
  136.                 <dd>
  137.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  138.                 </dd>
  139.                 <dd>
  140.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  141.                 </dd>
  142.                 <dd>
  143.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  144.                 </dd>
  145.             </dl>
  146.  
  147.             <dl class="fly-panel fly-list-one">
  148.                 <dt class="fly-panel-title">近期热议</dt>
  149.                 <dd>
  150.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  151.                 </dd>
  152.                 <dd>
  153.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  154.                 </dd>
  155.                 <dd>
  156.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  157.                 </dd>
  158.                 <dd>
  159.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  160.                 </dd>
  161.                 <dd>
  162.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  163.                 </dd>
  164.                 <dd>
  165.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  166.                 </dd>
  167.                 <dd>
  168.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  169.                 </dd>
  170.                 <dd>
  171.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  172.                 </dd>
  173.             </dl>
  174.         </div>
  175.     </div>
  176.     <script type="text/javascript" charset="utf-8" src="res/js/kindeditor.js"></script>
  177.     <script type="text/javascript">
  178.         KE.show({
  179.             id : 'L_content',
  180.             resizeMode : 1,
  181.             items : [ 'fontname', 'fontsize', 'textcolor', 'bgcolor', 'bold',
  182.                     'italic', 'underline', 'removeformat', 'justifyleft',
  183.                     'justifycenter', 'justifyright', 'insertorderedlist',
  184.                     'insertunorderedlist', 'emoticons', 'image', 'link' ]
  185.         });
  186.     </script>
  187. </body>
  188. </html>

detail.html

  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="utf-8" />
  5.     <link rel="stylesheet" type="text/css" href="css/index.css">
  6. </head>
  7.  
  8. <body style="margin:-2px">
  9. <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  10. <div class="dvContent">
  11.     <div class="dvquesleft">
  12.  
  13.         <div class="dvqstitle">
  14.             <image class="imgbean" src="data:images/bean.jpg">
  15.             <span class="qsTitle">问答</span>
  16.             <span class="back"><ab  href="">《《返回上一页</a></span>
  17.         </div>
  18.         <div class="dvtabhead">
  19.             <div class="tabheads tabcurrent">全部问题</div>
  20.             <div class="tabheads">我的问题</div>
  21.             <div class="tabheads">关注问题</div>
  22.             <div class="tabheads">问题标签</div>
  23.         </div>
  24.         <div class="tabContent">
  25.             <div class="dvtags">
  26.                 <a class="curenttag">待解决</a><span class="line"></span><a>高分</a><span
  27.                     class="line"></span><a>新回答</a><span class="line"></span><a>已解决</a>
  28.             </div>
  29.             <div class="tab">
  30.                 <div class="dvques">
  31.                     <div class="quesCount">
  32.                         <div class="count">8</div>
  33.                         <div class="ques">回答数</div>
  34.                     </div>
  35.                     <div class="quesContent">
  36.                         <div class="quesTitle">
  37.                             500
  38.                             <image src="data:images/bean.jpg" class="bean"> <span
  39.                                 class="spanques">Excel开发的问题</span>
  40.                         </div>
  41.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作以前都是OWC控件在程序中做Excel做操作，主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  42.                         <div class="tags">
  43.                             <span class="tag">excel</span><span class="tag">程序</span>
  44.                         </div>
  45.                         <div class="quesUser">
  46.                             <image src="data:images/0.gif" class="imguser" />
  47.                             <div class="userName">
  48.                                 张大值
  49.                                 <div class="liulan">浏览(9) 30分钟前</div>
  50.                             </div>
  51.  
  52.                         </div>
  53.                     </div>
  54.                 </div>
  55.                 <div class="dvques">
  56.                     <div class="quesCount">
  57.                         <div class="count">8</div>
  58.                         <div class="ques">回答数</div>
  59.                     </div>
  60.                     <div class="quesContent">
  61.                         <div class="quesTitle">
  62.                             500
  63.                             <image src="data:images/bean.jpg" class="bean"> <span
  64.                                 class="spanques">Excel开发的问题</span>
  65.                         </div>
  66.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  67.                         <div class="tags">
  68.                             <span class="tag">excel</span><span class="tag">程序</span>
  69.                         </div>
  70.                         <div class="quesUser">
  71.                             <image src="data:images/0.gif" class="imguser" />
  72.                             <div class="userName">
  73.                                 张大值
  74.                                 <div class="liulan">浏览(9) 30分钟前</div>
  75.                             </div>
  76.  
  77.                         </div>
  78.                     </div>
  79.                 </div>
  80.                 <div class="dvques">
  81.                     <div class="quesCount">
  82.                         <div class="count">8</div>
  83.                         <div class="ques">回答数</div>
  84.                     </div>
  85.                     <div class="quesContent">
  86.                         <div class="quesTitle">
  87.                             500
  88.                             <image src="data:images/bean.jpg" class="bean"> <span
  89.                                 class="spanques">Excel开发的问题</span>
  90.                         </div>
  91.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  92.                         <div class="tags">
  93.                             <span class="tag">excel</span><span class="tag">程序</span>
  94.                         </div>
  95.                         <div class="quesUser">
  96.                             <image src="data:images/0.gif" class="imguser" />
  97.                             <div class="userName">
  98.                                 张大值
  99.                                 <div class="liulan">浏览(9) 30分钟前</div>
  100.                             </div>
  101.  
  102.                         </div>
  103.                     </div>
  104.                 </div>
  105.                 <div class="dvques">
  106.                     <div class="quesCount">
  107.                         <div class="count">8</div>
  108.                         <div class="ques">回答数</div>
  109.                     </div>
  110.                     <div class="quesContent">
  111.                         <div class="quesTitle">
  112.                             500
  113.                             <image src="data:images/bean.jpg" class="bean"> <span
  114.                                 class="spanques">Excel开发的问题</span>
  115.                         </div>
  116.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  117.                         <div class="tags">
  118.                             <span class="tag">excel</span><span class="tag">程序</span>
  119.                         </div>
  120.                         <div class="quesUser">
  121.                             <image src="data:images/0.gif" class="imguser" />
  122.                             <div class="userName">
  123.                                 张大值
  124.                                 <div class="liulan">浏览(9) 30分钟前</div>
  125.                             </div>
  126.  
  127.                         </div>
  128.                     </div>
  129.                 </div>
  130.                 <div class="dvques">
  131.                     <div class="quesCount">
  132.                         <div class="count">8</div>
  133.                         <div class="ques">回答数</div>
  134.                     </div>
  135.                     <div class="quesContent">
  136.                         <div class="quesTitle">
  137.                             500
  138.                             <image src="data:images/bean.jpg" class="bean"> <span
  139.                                 class="spanques">Excel开发的问题</span>
  140.                         </div>
  141.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  142.                         <div class="tags">
  143.                             <span class="tag">excel</span><span class="tag">程序</span>
  144.                         </div>
  145.                         <div class="quesUser">
  146.                             <image src="data:images/0.gif" class="imguser" />
  147.                             <div class="userName">
  148.                                 张大值
  149.                                 <div class="liulan">浏览(9) 30分钟前</div>
  150.                             </div>
  151.  
  152.                         </div>
  153.                     </div>
  154.                 </div>
  155.  
  156.             </div>
  157.             <div class="tab hidden">2</div>
  158.             <div class="tab hidden">3</div>
  159.             <div class="tab hidden">4</div>
  160.         </div>
  161.     </div>
  162.     <div class="dvquesright">
  163.         <div>
  164.             <buton class="btnques" onclick="location.href='add.html'">提个问题</buton>
  165.         </div>
  166.         <div class="dvorder">
  167.             <div class="orderTitle">专家排行榜</div>
  168.             <div class="users">
  169.                 <image class="userface" src="data:images/0.gif" />
  170.                 <div class="dvuser">
  171.                     <div class="userTitle">陈有龙</div>
  172.                     <div class="userdeital">大牛6级 豆:14006</div>
  173.                 </div>
  174.             </div>
  175.             <div class="users">
  176.                 <image class="userface" src="data:images/1.gif" />
  177.                 <div class="dvuser">
  178.                     <div class="userTitle">陈有龙</div>
  179.                     <div class="userdeital">大牛6级 豆:14006</div>
  180.                 </div>
  181.             </div>
  182.             <div class="users">
  183.                 <image class="userface" src="data:images/2.gif" />
  184.                 <div class="dvuser">
  185.                     <div class="userTitle">陈有龙</div>
  186.                     <div class="userdeital">大牛6级 豆:14006</div>
  187.                 </div>
  188.             </div>
  189.             <div class="users">
  190.                 <image class="userface" src="data:images/3.gif" />
  191.                 <div class="dvuser">
  192.                     <div class="userTitle">陈有龙</div>
  193.                     <div class="userdeital">大牛6级 豆:14006</div>
  194.                 </div>
  195.             </div>
  196.             <div class="users">
  197.                 <image class="userface" src="data:images/4.gif" />
  198.                 <div class="dvuser">
  199.                     <div class="userTitle">陈有龙</div>
  200.                     <div class="userdeital">大牛6级 豆:14006</div>
  201.                 </div>
  202.             </div>
  203.             <div class="users">
  204.                 <image class="userface" src="data:images/5.gif" />
  205.                 <div class="dvuser">
  206.                     <div class="userTitle">陈有龙</div>
  207.                     <div class="userdeital">大牛6级 豆:14006</div>
  208.                 </div>
  209.             </div>
  210.             <div class="users">
  211.                 <image class="userface" src="data:images/6.gif" />
  212.                 <div class="dvuser">
  213.                     <div class="userTitle">陈有龙</div>
  214.                     <div class="userdeital">大牛6级 豆:14006</div>
  215.                 </div>
  216.             </div>
  217.  
  218.         </div>
  219.  
  220.     </div>
  221.  
  222. </div>
  223. <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
  224. <script type="text/javascript">
  225.     $(function()
  226.     {
  227.  
  228.         $(".tabheads").click(function()
  229.         {
  230.             $(".tabheads").removeClass("tabcurrent").eq($(this).index()).addClass("tabcurrent");
  231.             $(".tab").hide().eq($(this).index()).show();
  232.         });
  233.     });
  234. </script>
  235.  
  236. </body>
  237. </html>

index.html

  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5. <meta charset="UTF-8">
  6.  
  7. <link rel="stylesheet" href="css/head.css" />
  8. <link rel="stylesheet" type="text/css" href="css/login.css" />
  9. </head>
  10.  
  11. <body style="margin: -2px">
  12.  
  13.     <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  14.  
  15.     <section class="sec">
  16.         <form action="UserLoginServlet" method="post">
  17.             <div class="register-box">
  18.                 <label for="username" class="username_label"> 用 户 名 <input maxlength="20" name="userName" type="text" placeholder="您的用户名和登录名" />
  19.                 </label>
  20.                 <div class="tips"></div>
  21.             </div>
  22.             <div class="register-box">
  23.                 <label for="username" class="other_label"> 设 置 密 码 <input maxlength="20" type="password" name="pwd" placeholder="建议至少使用两种字符组合" />
  24.                 </label>
  25.                 <div class="tips"></div>
  26.             </div>
  27.             <div class="register-box">
  28.                 <label for="username" class="other_label"> 确 认 密 码 <input maxlength="20" type="password" placeholder="请再次输入密码" />
  29.                 </label>
  30.                 <div class="tips"></div>
  31.             </div>
  32.  
  33.             <div class="register-box">
  34.                 <label for="username" class="other_label"> 验 证 码 <input maxlength="20" type="text" placeholder="请输入验证码" />
  35.                 </label> <span id="code"></span>
  36.                 <div class="tips"></div>
  37.             </div>
  38.             <div class="arguement">
  39.                 <input type="checkbox" id="xieyi" /> 阅读并同意 <a href="javascript:void(0)">《你问我答用户注册协议》</a> <a href="register.html">没有账号,立即注册</a>
  40.                 <div class="tips"></div>
  41.             </div>
  42.             <div class="submit_btn">
  43.                 <button type="submit" id="submit_btn">立 即 登录</button>
  44.             </div>
  45.         </form>
  46.     </section>
  47.     <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
  48. </body>

login.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <link rel="stylesheet" type="text/css" href="css/login.css" />
  7. <link rel="stylesheet" href="css/head.css" />
  8. </head>
  9.  
  10. <body style="margin: -2px">
  11. <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  12.     <section class="sec">
  13.         <form action="UserRegServlet" method="post">
  14.             <div class="register-box">
  15.  
  16.                 <label for="username" class="username_label"> 用 户 名 <input maxlength="20" name="userName" type="text" placeholder="您的用户名和登录名" />
  17.                 </label>
  18.                 <div class="tips"></div>
  19.             </div>
  20.             <div class="register-box">
  21.                 <label for="username" class="other_label"> 设 置 密 码 <input maxlength="20" type="password" name="pwd" placeholder="建议至少使用两种字符组合" />
  22.                 </label>
  23.                 <div class="tips"></div>
  24.             </div>
  25.             <div class="register-box">
  26.                 <label for="username" class="other_label"> 确 认 密 码 <input maxlength="20" type="password" placeholder="请再次输入密码" />
  27.                 </label>
  28.                 <div class="tips"></div>
  29.             </div>
  30.  
  31.             <div class="register-box">
  32.                 <label for="username" class="username_label"> 真实姓名 <input maxlength="20" name="userName" type="text" placeholder="您的真实姓名" />
  33.                 </label>
  34.                 <div class="tips"></div>
  35.             </div>
  36.             <div class="register-box">
  37.                 <label for="username" class="username_label"> 邮箱 <input maxlength="20" name="userName" type="text" placeholder="您的邮箱" />
  38.                 </label>
  39.                 <div class="tips"></div>
  40.             </div>
  41.             <div class="register-box">
  42.                 <label for="username" class="username_label"> 手机号 <input maxlength="20" name="userName" type="text" placeholder="您的手机号" />
  43.                 </label>
  44.                 <div class="tips"></div>
  45.             </div>
  46.             <div class="arguement">
  47.                 <input type="checkbox" id="xieyi" /> 阅读并同意 <a href="javascript:void(0)">《错题用户注册协议》</a> <a href="login.html">已有账号,立即登录</a>
  48.                 <div class="tips"></div>
  49.             </div>
  50.             <div class="submit_btn">
  51.                 <button type="submit" id="submit_btn">立 即 注 册</button>
  52.             </div>
  53.         </form>
  54.     </section>
  55.     <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
  56. </body>
  57. </html>

register.html

修改注册与登陆界面

　　注册界面

  1. <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  2.  
  3.     <section class="sec">
  4.         <form action="UserLoginServlet" method="post">
  5.             <div class="register-box">
  6.                 <label for="username" class="username_label"> 用 户 名 <input maxlength="20" name="userName" type="text" placeholder="您的用户名和登录名" />
  7.                 </label>
  8.                 <div class="tips"></div>
  9.             </div>
  10.             <div class="register-box">
  11.                 <label for="username" class="other_label"> 密 码 <input maxlength="20" type="password" name="pwd" placeholder="建议至少使用两种字符组合" />
  12.                 </label>
  13.                 <div class="tips"></div>
  14.             </div>
  15.             <div class="arguement">
  16.                 <input type="checkbox" id="xieyi" /> 阅读并同意 <a href="javascript:void(0)">《你问我答用户注册协议》</a> <a href="register.html">没有账号,立即注册</a>
  17.                 <div class="tips"></div>
  18.             </div>
  19.             <div class="submit_btn">
  20.                 <button type="submit" id="submit_btn">立 即 登录</button>
  21.             </div>
  22.         </form>
  23.     </section>

　　登陆界面

  1. <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  2.  
  3.     <section class="sec">
  4.         <form action="UserLoginServlet" method="post">
  5.             <div class="register-box">
  6.                 <label for="username" class="username_label"> 用 户 名 <input maxlength="20" name="userName" type="text" placeholder="您的用户名和登录名" />
  7.                 </label>
  8.                 <div class="tips"></div>
  9.             </div>
  10.             <div class="register-box">
  11.                 <label for="username" class="other_label"> 密 码 <input maxlength="20" type="password" name="pwd" placeholder="建议至少使用两种字符组合" />
  12.                 </label>
  13.                 <div class="tips"></div>
  14.             </div>
  15.             <div class="arguement">
  16.                 <input type="checkbox" id="xieyi" /> 阅读并同意 <a href="javascript:void(0)">《你问我答用户注册协议》</a> <a href="register.html">没有账号,立即注册</a>
  17.                 <div class="tips"></div>
  18.             </div>
  19.             <div class="submit_btn">
  20.                 <button type="submit" id="submit_btn">立 即 登录</button>
  21.             </div>
  22.         </form>
  23.     </section>
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <link rel="stylesheet" type="text/css" href="css/login.css" />
  7. <link rel="stylesheet" href="css/head.css" />
  8. </head>
  9.  
  10. <body style="margin: -2px">
  11. <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  12.     <section class="sec">
  13.         <form action="UserRegServlet" method="post">
  14.             <div class="register-box">
  15.  
  16.                 <label for="username" class="username_label"> 用 户 名 <input maxlength="20" name="userName" type="text" placeholder="您的用户名和登录名" />
  17.                 </label>
  18.                 <div class="tips"></div>
  19.             </div>
  20.             <div class="register-box">
  21.                 <label for="username" class="other_label"> 设 置 密 码 <input maxlength="20" type="password" name="pwd" placeholder="建议至少使用两种字符组合" />
  22.                 </label>
  23.                 <div class="tips"></div>
  24.             </div>
  25.             <div class="register-box">
  26.                 <label for="username" class="other_label"> 确 认 密 码 <input maxlength="20" type="password" placeholder="请再次输入密码" />
  27.                 </label>
  28.                 <div class="tips"></div>
  29.             </div>
  30.  
  31.             <div class="register-box">
  32.                 <label for="username" class="username_label"> 真实姓名 <input maxlength="20" name="userName" type="text" placeholder="您的真实姓名" />
  33.                 </label>
  34.                 <div class="tips"></div>
  35.             </div>
  36.             <div class="register-box">
  37.                 <label for="username" class="username_label"> 邮箱 <input maxlength="20" name="userName" type="text" placeholder="您的邮箱" />
  38.                 </label>
  39.                 <div class="tips"></div>
  40.             </div>
  41.             <div class="register-box">
  42.                 <label for="username" class="username_label"> 手机号 <input maxlength="20" name="userName" type="text" placeholder="您的手机号" />
  43.                 </label>
  44.                 <div class="tips"></div>
  45.             </div>
  46.             <div class="arguement">
  47.                 <input type="checkbox" id="xieyi" /> 阅读并同意 <a href="javascript:void(0)">《错题用户注册协议》</a> <a href="login.html">已有账号,立即登录</a>
  48.                 <div class="tips"></div>
  49.             </div>
  50.             <div class="submit_btn">
  51.                 <button type="submit" id="submit_btn">立 即 注 册</button>
  52.             </div>
  53.         </form>
  54.     </section>
  55.     <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
  56. </body>
  57. </html>

register.html

  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5. <meta charset="UTF-8">
  6.  
  7. <link rel="stylesheet" href="css/head.css" />
  8. <link rel="stylesheet" type="text/css" href="css/login.css" />
  9. </head>
  10.  
  11. <body style="margin: -2px">
  12.  
  13.     <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  14.  
  15.     <section class="sec">
  16.         <form action="UserLoginServlet" method="post">
  17.             <div class="register-box">
  18.                 <label for="username" class="username_label"> 用 户 名 <input maxlength="20" name="userName" type="text" placeholder="您的用户名和登录名" />
  19.                 </label>
  20.                 <div class="tips"></div>
  21.             </div>
  22.             <div class="register-box">
  23.                 <label for="username" class="other_label"> 密 码 <input maxlength="20" type="password" name="pwd" placeholder="建议至少使用两种字符组合" />
  24.                 </label>
  25.                 <div class="tips"></div>
  26.             </div>
  27.             <div class="arguement">
  28.                 <input type="checkbox" id="xieyi" /> 阅读并同意 <a href="javascript:void(0)">《你问我答用户注册协议》</a> <a href="register.html">没有账号,立即注册</a>
  29.                 <div class="tips"></div>
  30.             </div>
  31.             <div class="submit_btn">
  32.                 <button type="submit" id="submit_btn">立 即 登录</button>
  33.             </div>
  34.         </form>
  35.     </section>
  36.     <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
  37. </body>

login.html

修改主页(index.html)右侧div

　　最近热帖

  1. <dl class="fly-panel fly-list-one">
  2.                 <dt class="fly-panel-title">最近热帖</dt>
  3.                 <dd>
  4.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  5.                 </dd>
  6.                 <dd>
  7.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  8.                 </dd>
  9.                 <dd>
  10.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  11.                 </dd>
  12.                 <dd>
  13.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  14.                 </dd>
  15.                 <dd>
  16.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  17.                 </dd>
  18.                 <dd>
  19.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  20.                 </dd>
  21.                 <dd>
  22.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  23.                 </dd>
  24.                 <dd>
  25.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  26.                 </dd>
  27.             </dl>

　　近期热议

  1. <dl class="fly-panel fly-list-one">
  2.                 <dt class="fly-panel-title">近期热议</dt>
  3.                 <dd>
  4.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  5.                 </dd>
  6.                 <dd>
  7.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  8.                 </dd>
  9.                 <dd>
  10.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  11.                 </dd>
  12.                 <dd>
  13.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  14.                 </dd>
  15.                 <dd>
  16.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  17.                 </dd>
  18.                 <dd>
  19.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  20.                 </dd>
  21.                 <dd>
  22.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  23.                 </dd>
  24.                 <dd>
  25.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  26.                 </dd>
  27.             </dl>
  28.

　　专家排行榜

  1. <div class="orderTitle">专家排行榜</div>
  2.             <div class="users">
  3.                 <image class="userface" src="data:images/0.gif" />
  4.                 <div class="dvuser">
  5.                     <div class="userTitle">陈有龙</div>
  6.                     <div class="userdeital">大牛6级 豆:14006</div>
  7.                 </div>
  8.             </div>
  9.             <div class="users">
  10.                 <image class="userface" src="data:images/1.gif" />
  11.                 <div class="dvuser">
  12.                     <div class="userTitle">陈有龙</div>
  13.                     <div class="userdeital">大牛6级 豆:14006</div>
  14.                 </div>
  15.             </div>
  16.             <div class="users">
  17.                 <image class="userface" src="data:images/2.gif" />
  18.                 <div class="dvuser">
  19.                     <div class="userTitle">陈有龙</div>
  20.                     <div class="userdeital">大牛6级 豆:14006</div>
  21.                 </div>
  22.             </div>
  23.             <div class="users">
  24.                 <image class="userface" src="data:images/3.gif" />
  25.                 <div class="dvuser">
  26.                     <div class="userTitle">陈有龙</div>
  27.                     <div class="userdeital">大牛6级 豆:14006</div>
  28.                 </div>
  29.             </div>
  30.             <div class="users">
  31.                 <image class="userface" src="data:images/4.gif" />
  32.                 <div class="dvuser">
  33.                     <div class="userTitle">陈有龙</div>
  34.                     <div class="userdeital">大牛6级 豆:14006</div>
  35.                 </div>
  36.             </div>
  37.             <div class="users">
  38.                 <image class="userface" src="data:images/5.gif" />
  39.                 <div class="dvuser">
  40.                     <div class="userTitle">陈有龙</div>
  41.                     <div class="userdeital">大牛6级 豆:14006</div>
  42.                 </div>
  43.             </div>
  44.             <div class="users">
  45.                 <image class="userface" src="data:images/6.gif" />
  46.                 <div class="dvuser">
  47.                     <div class="userTitle">陈有龙</div>
  48.                     <div class="userdeital">大牛6级 豆:14006</div>
  49.                 </div>
  50.             </div>
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="utf-8" />
  5.     <link rel="stylesheet" type="text/css" href="css/index.css">
  6.     <link rel="stylesheet" href="res/css/global.css">
  7. </head>
  8.  
  9. <body style="margin:-2px">
  10. <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  11. <div class="dvContent">
  12.     <div class="dvquesleft">
  13.  
  14.         <div class="dvqstitle">
  15.             <image class="imgbean" src="data:images/bean.jpg">
  16.             <span class="qsTitle">问答</span>
  17.             <span class="back"><ab  href="">《《返回上一页</a></span>
  18.         </div>
  19.         <div class="dvtabhead">
  20.             <div class="tabheads tabcurrent">全部问题</div>
  21.             <div class="tabheads">我的问题</div>
  22.             <div class="tabheads">关注问题</div>
  23.             <div class="tabheads">问题标签</div>
  24.         </div>
  25.         <div class="tabContent">
  26.             <div class="dvtags">
  27.                 <a class="curenttag">待解决</a><span class="line"></span><a>高分</a><span
  28.                     class="line"></span><a>新回答</a><span class="line"></span><a>已解决</a>
  29.             </div>
  30.             <div class="tab">
  31.                 <div class="dvques">
  32.                     <div class="quesCount">
  33.                         <div class="count">8</div>
  34.                         <div class="ques">回答数</div>
  35.                     </div>
  36.                     <div class="quesContent">
  37.                         <div class="quesTitle">
  38.                             500
  39.                             <image src="data:images/bean.jpg" class="bean"> <span
  40.                                 class="spanques">Excel开发的问题</span>
  41.                         </div>
  42.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作以前都是OWC控件在程序中做Excel做操作，主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  43.                         <div class="tags">
  44.                             <span class="tag">excel</span><span class="tag">程序</span>
  45.                         </div>
  46.                         <div class="quesUser">
  47.                             <image src="data:images/0.gif" class="imguser" />
  48.                             <div class="userName">
  49.                                 张大值
  50.                                 <div class="liulan">浏览(9) 30分钟前</div>
  51.                             </div>
  52.  
  53.                         </div>
  54.                     </div>
  55.                 </div>
  56.                 <div class="dvques">
  57.                     <div class="quesCount">
  58.                         <div class="count">8</div>
  59.                         <div class="ques">回答数</div>
  60.                     </div>
  61.                     <div class="quesContent">
  62.                         <div class="quesTitle">
  63.                             500
  64.                             <image src="data:images/bean.jpg" class="bean"> <span
  65.                                 class="spanques">Excel开发的问题</span>
  66.                         </div>
  67.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  68.                         <div class="tags">
  69.                             <span class="tag">excel</span><span class="tag">程序</span>
  70.                         </div>
  71.                         <div class="quesUser">
  72.                             <image src="data:images/0.gif" class="imguser" />
  73.                             <div class="userName">
  74.                                 张大值
  75.                                 <div class="liulan">浏览(9) 30分钟前</div>
  76.                             </div>
  77.  
  78.                         </div>
  79.                     </div>
  80.                 </div>
  81.                 <div class="dvques">
  82.                     <div class="quesCount">
  83.                         <div class="count">8</div>
  84.                         <div class="ques">回答数</div>
  85.                     </div>
  86.                     <div class="quesContent">
  87.                         <div class="quesTitle">
  88.                             500
  89.                             <image src="data:images/bean.jpg" class="bean"> <span
  90.                                 class="spanques">Excel开发的问题</span>
  91.                         </div>
  92.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  93.                         <div class="tags">
  94.                             <span class="tag">excel</span><span class="tag">程序</span>
  95.                         </div>
  96.                         <div class="quesUser">
  97.                             <image src="data:images/0.gif" class="imguser" />
  98.                             <div class="userName">
  99.                                 张大值
  100.                                 <div class="liulan">浏览(9) 30分钟前</div>
  101.                             </div>
  102.  
  103.                         </div>
  104.                     </div>
  105.                 </div>
  106.                 <div class="dvques">
  107.                     <div class="quesCount">
  108.                         <div class="count">8</div>
  109.                         <div class="ques">回答数</div>
  110.                     </div>
  111.                     <div class="quesContent">
  112.                         <div class="quesTitle">
  113.                             500
  114.                             <image src="data:images/bean.jpg" class="bean"> <span
  115.                                 class="spanques">Excel开发的问题</span>
  116.                         </div>
  117.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  118.                         <div class="tags">
  119.                             <span class="tag">excel</span><span class="tag">程序</span>
  120.                         </div>
  121.                         <div class="quesUser">
  122.                             <image src="data:images/0.gif" class="imguser" />
  123.                             <div class="userName">
  124.                                 张大值
  125.                                 <div class="liulan">浏览(9) 30分钟前</div>
  126.                             </div>
  127.  
  128.                         </div>
  129.                     </div>
  130.                 </div>
  131.                 <div class="dvques">
  132.                     <div class="quesCount">
  133.                         <div class="count">8</div>
  134.                         <div class="ques">回答数</div>
  135.                     </div>
  136.                     <div class="quesContent">
  137.                         <div class="quesTitle">
  138.                             500
  139.                             <image src="data:images/bean.jpg" class="bean"> <span
  140.                                 class="spanques">Excel开发的问题</span>
  141.                         </div>
  142.                         <div class="qContent">以前都是OWC控件在程序中做Excel做操作，主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  143.                         <div class="tags">
  144.                             <span class="tag">excel</span><span class="tag">程序</span>
  145.                         </div>
  146.                         <div class="quesUser">
  147.                             <image src="data:images/0.gif" class="imguser" />
  148.                             <div class="userName">
  149.                                 张大值
  150.                                 <div class="liulan">浏览(9) 30分钟前</div>
  151.                             </div>
  152.  
  153.                         </div>
  154.                     </div>
  155.                 </div>
  156.  
  157.             </div>
  158.             <div class="tab hidden">2</div>
  159.             <div class="tab hidden">3</div>
  160.             <div class="tab hidden">4</div>
  161.         </div>
  162.     </div>
  163.     <div class="dvquesright">
  164.         <div>
  165.             <buton class="btnques" onclick="location.href='add.html'">提个问题</buton>
  166.         </div>
  167.  
  168.         <div class="dvorder">
  169.  
  170.             <dl class="fly-panel fly-list-one">
  171.                 <dt class="fly-panel-title">最近热帖</dt>
  172.                 <dd>
  173.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  174.                 </dd>
  175.                 <dd>
  176.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  177.                 </dd>
  178.                 <dd>
  179.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  180.                 </dd>
  181.                 <dd>
  182.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  183.                 </dd>
  184.                 <dd>
  185.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  186.                 </dd>
  187.                 <dd>
  188.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  189.                 </dd>
  190.                 <dd>
  191.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  192.                 </dd>
  193.                 <dd>
  194.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  195.                 </dd>
  196.             </dl>
  197.  
  198.             <dl class="fly-panel fly-list-one">
  199.                 <dt class="fly-panel-title">近期热议</dt>
  200.                 <dd>
  201.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  202.                 </dd>
  203.                 <dd>
  204.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  205.                 </dd>
  206.                 <dd>
  207.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  208.                 </dd>
  209.                 <dd>
  210.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  211.                 </dd>
  212.                 <dd>
  213.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  214.                 </dd>
  215.                 <dd>
  216.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  217.                 </dd>
  218.                 <dd>
  219.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  220.                 </dd>
  221.                 <dd>
  222.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  223.                 </dd>
  224.             </dl>
  225.  
  226.             <div class="orderTitle">专家排行榜</div>
  227.             <div class="users">
  228.                 <image class="userface" src="data:images/0.gif" />
  229.                 <div class="dvuser">
  230.                     <div class="userTitle">陈有龙</div>
  231.                     <div class="userdeital">大牛6级 豆:14006</div>
  232.                 </div>
  233.             </div>
  234.             <div class="users">
  235.                 <image class="userface" src="data:images/1.gif" />
  236.                 <div class="dvuser">
  237.                     <div class="userTitle">陈有龙</div>
  238.                     <div class="userdeital">大牛6级 豆:14006</div>
  239.                 </div>
  240.             </div>
  241.             <div class="users">
  242.                 <image class="userface" src="data:images/2.gif" />
  243.                 <div class="dvuser">
  244.                     <div class="userTitle">陈有龙</div>
  245.                     <div class="userdeital">大牛6级 豆:14006</div>
  246.                 </div>
  247.             </div>
  248.             <div class="users">
  249.                 <image class="userface" src="data:images/3.gif" />
  250.                 <div class="dvuser">
  251.                     <div class="userTitle">陈有龙</div>
  252.                     <div class="userdeital">大牛6级 豆:14006</div>
  253.                 </div>
  254.             </div>
  255.             <div class="users">
  256.                 <image class="userface" src="data:images/4.gif" />
  257.                 <div class="dvuser">
  258.                     <div class="userTitle">陈有龙</div>
  259.                     <div class="userdeital">大牛6级 豆:14006</div>
  260.                 </div>
  261.             </div>
  262.             <div class="users">
  263.                 <image class="userface" src="data:images/5.gif" />
  264.                 <div class="dvuser">
  265.                     <div class="userTitle">陈有龙</div>
  266.                     <div class="userdeital">大牛6级 豆:14006</div>
  267.                 </div>
  268.             </div>
  269.             <div class="users">
  270.                 <image class="userface" src="data:images/6.gif" />
  271.                 <div class="dvuser">
  272.                     <div class="userTitle">陈有龙</div>
  273.                     <div class="userdeital">大牛6级 豆:14006</div>
  274.                 </div>
  275.             </div>
  276.  
  277.         </div>
  278.  
  279.     </div>
  280.  
  281. </div>
  282. <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
  283. <script type="text/javascript">
  284.     $(function()
  285.     {
  286.  
  287.         $(".tabheads").click(function()
  288.         {
  289.             $(".tabheads").removeClass("tabcurrent").eq($(this).index()).addClass("tabcurrent");
  290.             $(".tab").hide().eq($(this).index()).show();
  291.         });
  292.     });
  293. </script>
  294.  
  295. </body>
  296. </html>

index.html

修改jsp与html自动结构化

　　设置一个标签占一行

　　修改Html同时Jsp代码格式同样被修改

　　

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>发表问题</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  7. <link rel="stylesheet" href="css/head.css" />
  8. <link rel="stylesheet" href="layui/css/layui.css">
  9.  
  10. <link rel="stylesheet" href="css/global.css">
  11.  
  12. <script src="layui/layui.js"></script>
  13. </head>
  14. <body style="margin: -2px">
  15.  
  16.     <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  17.  
  18.     <div class="main layui-clear">
  19.         <div class="fly-panel" pad20>
  20.             <h2 class="page-title">发表问题</h2>
  21.  
  22.             <!-- <div class="fly-none">并无权限</div> -->
  23.  
  24.             <div class="layui-form layui-form-pane">
  25.                 <form action=" ">
  26.                     <div class="layui-form-item">
  27.                         <label for="L_title" class="layui-form-label">标题</label>
  28.                         <div class="layui-input-block">
  29.                             <input type="text" id="L_title" name="title" required lay-verify="required" autocomplete="off" class="layui-input">
  30.                         </div>
  31.                     </div>
  32.                     <div class="layui-form-item layui-form-text">
  33.                         <div class="layui-input-block">
  34.                             <div class="editor">
  35.                                 <textarea id="content" name="content" style="width: 1040px; height: 450px; visibility: hidden;"></textarea>
  36.                             </div>
  37.                         </div>
  38.                         <label for="L_content" class="layui-form-label" style="top: -2px;">描述</label>
  39.                     </div>
  40.                     <div class="layui-form-item">
  41.                         <label for="L_title" class="layui-form-label">悬赏</label>
  42.                         <div class="layui-input-block">
  43.                             <input type="number" name="reward" required lay-verify="required" autocomplete="off" class="layui-input">
  44.                         </div>
  45.                     </div>
  46.                     <div class="layui-form-item">
  47.                         <button class="layui-btn" lay-filter="*" lay-submit>立即发布</button>
  48.                     </div>
  49.                 </form>
  50.             </div>
  51.         </div>
  52.     </div>
  53.  
  54.     <script type="text/javascript" charset="utf-8" src="js/kindeditor.js"></script>
  55.     <script type="text/javascript">
  56.         KE.show({
  57.             id : 'content',
  58.             resizeMode : 1,
  59.             cssPath : './index.css',
  60.             items : [ 'fontname', 'fontsize', 'textcolor', 'bgcolor', 'bold',
  61.                     'italic', 'underline', 'removeformat', 'justifyleft',
  62.                     'justifycenter', 'justifyright', 'insertorderedlist',
  63.                     'insertunorderedlist', 'emoticons', 'image', 'link' ]
  64.         });
  65.     </script>
  66.     <script>
  67.         layui.cache.page = '';
  68.         layui.cache.user = {
  69.             username : '游客',
  70.             uid : -1,
  71.             avatar : '../res/images/avatar/00.jpg',
  72.             experience : 83,
  73.             sex : '男'
  74.         };
  75.         layui.config({
  76.             version : "2.0.0",
  77.             base : '../res/mods/'
  78.         }).extend({
  79.             fly : 'index'
  80.         }).use('fly');
  81.     </script>
  82. </body>
  83. </html>

add.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>问题详情</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  7. <meta name="keywords" content="fly,layui,前端社区">
  8. <meta name="description" content="">
  9. <link rel="stylesheet" href="res/layui/css/layui.css">
  10. <link rel="stylesheet" href="res/css/global.css">
  11. <script src="res/layui/layui.js"></script>
  12. <script src="js/jquery.js"></script>
  13. <style type="text/css" rel="stylesheet">
  14. form {
  15.     margin: 0;
  16. }
  17.  
  18. .editor {
  19.     margin-top: 5px;
  20.     margin-bottom: 5px;
  21. }
  22. </style>
  23.  
  24. </head>
  25. <body style="margin: -2px">
  26.     <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  27.     <div class="main layui-clear">
  28.         <div class="wrap">
  29.             <div class="content detail">
  30.                 <div class="fly-panel detail-box">
  31.                     <h1>帖子标题</h1>
  32.                     <div class="fly-tip fly-detail-hint" data-id="">
  33.                         <span class="fly-tip-stick">置顶帖</span><span class="jie-admin"> <a href="">点击置顶</a>
  34.                         </span> <span class="layui-btn layui-btn-mini jie-admin"> <a href="">取消置顶</a>
  35.                         </span> <span class="jie-admin" type="del" style="margin-left: 20px;"> <a>删除该帖</a>
  36.                         </span> </span>
  37.                         <div class="fly-list-hint">
  38.                             <i class="iconfont" title="回答"></i> 2
  39.                         </div>
  40.                     </div>
  41.                     <div class="detail-about">
  42.                         <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt="头像"> <cite> 压缩 <em>2017-05-01发布</em>
  43.                         </cite>
  44.                         </a>
  45.                         <div class="detail-hits" data-id="{{rows.id}}">
  46.                             <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>
  47.                             </span> <span class="layui-btn layui-btn-mini jie-admin  layui-btn-danger" type="collect" data-type="add"> <a>取消收藏</a>
  48.                             </span>
  49.  
  50.                         </div>
  51.                     </div>
  52.                     <div class="detail-body photos" style="margin-bottom: 20px;">
  53.                         <p>帖子内容</p>
  54.                     </div>
  55.                 </div>
  56.                 <div class="fly-panel detail-box" style="padding-top: 0;">
  57.                     <a name="comment"></a>
  58.                     <ul class="jieda photos" id="jieda">
  59.                         <li data-id="12" class="jieda-daan"><a name="item-121212121212"></a>
  60.                             <div class="detail-about detail-about-reply">
  61.                                 <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt=""> <cite> <i>纸飞机</i> <!-- <em>(楼主)</em>
  62.                   <em style="color:#5FB878">(管理员)</em> -->
  63.                                 </cite>
  64.                                 </a>
  65.                                 <div class="detail-hits">
  66.                                     <span>3分钟前</span>
  67.                                 </div>
  68.                                 <i class="iconfont icon-caina" title="最佳答案"></i>
  69.                             </div>
  70.                             <div class="detail-body jieda-body">
  71.                                 <p>么么哒</p>
  72.                             </div>
  73.                             <div class="jieda-reply">
  74.                                 <span class="jieda-zan zanok" type="zan"><i class="iconfont icon-zan"></i><em>12</em> </span>
  75.                                 <!-- <div class="jieda-admin">
  76.                 <span type="del">删除</span>
  77.                 <span class="jieda-accept" type="accept">采纳</span>
  78.               </div> -->
  79.                             </div></li>
  80.                         <li data-id="13"><a name="item-121212121212"></a>
  81.                             <div class="detail-about detail-about-reply">
  82.                                 <a class="jie-user" href=""> <img src="res/images/uer.jpg" alt=""> <cite> <i>香菇</i> <em style="color: #FF9E3F">活雷锋</em>
  83.                                 </cite>
  84.                                 </a>
  85.                                 <div class="detail-hits">
  86.                                     <span>刚刚</span>
  87.                                 </div>
  88.                             </div>
  89.                             <div class="detail-body jieda-body">
  90.                                 <p>蓝瘦</p>
  91.                             </div>
  92.                             <div class="jieda-reply">
  93.                                 <span class="jieda-zan" type="zan"><i class="iconfont icon-zan"></i><em>0</em> </span>
  94.                                 <div class="jieda-admin">
  95.                                     <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>
  96.                                 </div>
  97.                             </div></li>
  98.  
  99.                         <!-- <li class="fly-none">没有任何回答</li> -->
  100.                     </ul>
  101.                     <span id="toName">@ 压缩(楼主)</span>
  102.                     <div class="layui-form layui-form-pane">
  103.                         <form action="">
  104.                             <div class="layui-form-item layui-form-text">
  105.                                 <div class="layui-input-block">
  106.                                     <textarea id="L_content" name="content" required lay-verify="required" placeholder="我要回答" class="layui-textarea fly-editor" style="height: 150px;"></textarea>
  107.                                 </div>
  108.                             </div>
  109.                             <div class="layui-form-item">
  110.                                 <button class="layui-btn" lay-filter="*" lay-submit>提交回答</button>
  111.                             </div>
  112.                         </form>
  113.                     </div>
  114.                 </div>
  115.             </div>
  116.         </div>
  117.  
  118.         <div class="edge">
  119.             <dl class="fly-panel fly-list-one">
  120.                 <dt class="fly-panel-title">最近热帖</dt>
  121.                 <dd>
  122.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  123.                 </dd>
  124.                 <dd>
  125.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  126.                 </dd>
  127.                 <dd>
  128.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  129.                 </dd>
  130.                 <dd>
  131.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  132.                 </dd>
  133.                 <dd>
  134.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  135.                 </dd>
  136.                 <dd>
  137.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  138.                 </dd>
  139.                 <dd>
  140.                     <a href="">使用 layui 秒搭后台大布局（基本结构）</a> <span><i class="iconfont"></i> 6087</span>
  141.                 </dd>
  142.                 <dd>
  143.                     <a href="">Java实现LayIM后端的核心代码</a> <span><i class="iconfont"></i> 767</span>
  144.                 </dd>
  145.             </dl>
  146.  
  147.             <dl class="fly-panel fly-list-one">
  148.                 <dt class="fly-panel-title">近期热议</dt>
  149.                 <dd>
  150.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  151.                 </dd>
  152.                 <dd>
  153.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  154.                 </dd>
  155.                 <dd>
  156.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  157.                 </dd>
  158.                 <dd>
  159.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  160.                 </dd>
  161.                 <dd>
  162.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  163.                 </dd>
  164.                 <dd>
  165.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  166.                 </dd>
  167.                 <dd>
  168.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  169.                 </dd>
  170.                 <dd>
  171.                     <a href="">使用 layui 秒搭后台大布局之基本结构</a> <span><i class="iconfont"></i> 96</span>
  172.                 </dd>
  173.             </dl>
  174.         </div>
  175.     </div>
  176.     <script type="text/javascript" charset="utf-8" src="res/js/kindeditor.js"></script>
  177.     <script type="text/javascript">
  178.         KE.show({
  179.             id : 'L_content',
  180.             resizeMode : 1,
  181.             items : [ 'fontname', 'fontsize', 'textcolor', 'bgcolor', 'bold',
  182.                     'italic', 'underline', 'removeformat', 'justifyleft',
  183.                     'justifycenter', 'justifyright', 'insertorderedlist',
  184.                     'insertunorderedlist', 'emoticons', 'image', 'link' ]
  185.         });
  186.     </script>
  187. </body>
  188. </html>

detail.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <link rel="stylesheet" href="res/layui/css/layui.css">
  7. <link rel="stylesheet" href="res/css/global.css">
  8. <link rel="stylesheet" type="text/css" href="css/index.css">
  9. <script src="res/layui/layui.js"></script>
  10. <style>
  11. </style>
  12. </head>
  13. <body>
  14.     <div class="dvhead">
  15.     <div class="dvlogo">
  16.         <a href="index.html">你问我答</a>
  17.     </div>
  18.     <div class="dvsearch">10秒钟注册账号，找到你的同学</div>
  19.     <div class="nav-user" style="top:0px;right:100px;">
  20.  
  21.           <!--描述：未登录的样子
  22.  
  23.                     <a class="avatar" href="">
  24.                         <img src="res/images/avatar/11.jpg">
  25.                         <cite>贤心</cite>
  26.                     </a>
  27.                     <div class="nav">
  28.                         <a href=""><i class="iconfont icon-tuichu" style="top: 0; font-size: 22px;"></i>退出</a>
  29.                     </div>
  30.                  -->
  31.  
  32.         <!--描述：未登录的样子-->
  33.  
  34.         <a class="iconfont icon-touxiang layui-hide-xs" style="margin-top: 4px; display: inline-block;"> </a>
  35.         <div class="nav" style="font-size: 14px; color: white; margin-top: -5px; margin-left: 1px;" />
  36.         <a href="login.html" target="_parent">登录</a> <a href="register.html" target="_parent">注册</a>
  37.     </div>
  38. </div>
  39. </body>
  40. </html>

head.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <link rel="stylesheet" type="text/css" href="css/index.css">
  6. <link rel="stylesheet" href="res/css/global.css">
  7. </head>
  8.  
  9. <body style="margin: -2px">
  10.     <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  11.     <div class="dvContent">
  12.         <div class="dvquesleft">
  13.  
  14.             <div class="dvqstitle">
  15.                 <image class="imgbean" src="data:images/bean.jpg"> <span class="qsTitle">问答</span> <span class="back">
  16.                     <ab href="">《《返回上一页</a>
  17.                 </span>
  18.             </div>
  19.             <div class="dvtabhead">
  20.                 <div class="tabheads tabcurrent">全部问题</div>
  21.                 <div class="tabheads">我的问题</div>
  22.                 <div class="tabheads">关注问题</div>
  23.                 <div class="tabheads">问题标签</div>
  24.             </div>
  25.             <div class="tabContent">
  26.                 <div class="dvtags">
  27.                     <a class="curenttag">待解决</a>
  28.                     <span class="line"></span>
  29.                     <a>高分</a>
  30.                     <span class="line"></span>
  31.                     <a>新回答</a>
  32.                     <span class="line"></span>
  33.                     <a>已解决</a>
  34.                 </div>
  35.                 <div class="tab">
  36.                     <div class="dvques">
  37.                         <div class="quesCount">
  38.                             <div class="count">8</div>
  39.                             <div class="ques">回答数</div>
  40.                         </div>
  41.                         <div class="quesContent">
  42.                             <div class="quesTitle">
  43.                                 500
  44.                                 <image src="data:images/bean.jpg" class="bean"> <span class="spanques">Excel开发的问题</span>
  45.                             </div>
  46.                             <div class="qContent">以前都是OWC控件在程序中做Excel做操作以前都是OWC控件在程序中做Excel做操作，主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  47.                             <div class="tags">
  48.                                 <span class="tag">excel</span>
  49.                                 <span class="tag">程序</span>
  50.                             </div>
  51.                             <div class="quesUser">
  52.                                 <image src="data:images/0.gif" class="imguser" />
  53.                                 <div class="userName">
  54.                                     张大值
  55.                                     <div class="liulan">浏览(9) 30分钟前</div>
  56.                                 </div>
  57.  
  58.                             </div>
  59.                         </div>
  60.                     </div>
  61.                     <div class="dvques">
  62.                         <div class="quesCount">
  63.                             <div class="count">8</div>
  64.                             <div class="ques">回答数</div>
  65.                         </div>
  66.                         <div class="quesContent">
  67.                             <div class="quesTitle">
  68.                                 500
  69.                                 <image src="data:images/bean.jpg" class="bean"> <span class="spanques">Excel开发的问题</span>
  70.                             </div>
  71.                             <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  72.                             <div class="tags">
  73.                                 <span class="tag">excel</span>
  74.                                 <span class="tag">程序</span>
  75.                             </div>
  76.                             <div class="quesUser">
  77.                                 <image src="data:images/0.gif" class="imguser" />
  78.                                 <div class="userName">
  79.                                     张大值
  80.                                     <div class="liulan">浏览(9) 30分钟前</div>
  81.                                 </div>
  82.  
  83.                             </div>
  84.                         </div>
  85.                     </div>
  86.                     <div class="dvques">
  87.                         <div class="quesCount">
  88.                             <div class="count">8</div>
  89.                             <div class="ques">回答数</div>
  90.                         </div>
  91.                         <div class="quesContent">
  92.                             <div class="quesTitle">
  93.                                 500
  94.                                 <image src="data:images/bean.jpg" class="bean"> <span class="spanques">Excel开发的问题</span>
  95.                             </div>
  96.                             <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  97.                             <div class="tags">
  98.                                 <span class="tag">excel</span>
  99.                                 <span class="tag">程序</span>
  100.                             </div>
  101.                             <div class="quesUser">
  102.                                 <image src="data:images/0.gif" class="imguser" />
  103.                                 <div class="userName">
  104.                                     张大值
  105.                                     <div class="liulan">浏览(9) 30分钟前</div>
  106.                                 </div>
  107.  
  108.                             </div>
  109.                         </div>
  110.                     </div>
  111.                     <div class="dvques">
  112.                         <div class="quesCount">
  113.                             <div class="count">8</div>
  114.                             <div class="ques">回答数</div>
  115.                         </div>
  116.                         <div class="quesContent">
  117.                             <div class="quesTitle">
  118.                                 500
  119.                                 <image src="data:images/bean.jpg" class="bean"> <span class="spanques">Excel开发的问题</span>
  120.                             </div>
  121.                             <div class="qContent">以前都是OWC控件在程序中做Excel做操作，以前都是OWC控件在程序中做Excel做操作主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  122.                             <div class="tags">
  123.                                 <span class="tag">excel</span>
  124.                                 <span class="tag">程序</span>
  125.                             </div>
  126.                             <div class="quesUser">
  127.                                 <image src="data:images/0.gif" class="imguser" />
  128.                                 <div class="userName">
  129.                                     张大值
  130.                                     <div class="liulan">浏览(9) 30分钟前</div>
  131.                                 </div>
  132.  
  133.                             </div>
  134.                         </div>
  135.                     </div>
  136.                     <div class="dvques">
  137.                         <div class="quesCount">
  138.                             <div class="count">8</div>
  139.                             <div class="ques">回答数</div>
  140.                         </div>
  141.                         <div class="quesContent">
  142.                             <div class="quesTitle">
  143.                                 500
  144.                                 <image src="data:images/bean.jpg" class="bean"> <span class="spanques">Excel开发的问题</span>
  145.                             </div>
  146.                             <div class="qContent">以前都是OWC控件在程序中做Excel做操作，主要包裹以前裹做Excel做操作，主要包裹以前都是OWC控件在程序中做Excel做操作，主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...主要包裹主要包裹以前都是主要包中做Excel做操作，主要包裹，主要包裹...</div>
  147.                             <div class="tags">
  148.                                 <span class="tag">excel</span>
  149.                                 <span class="tag">程序</span>
  150.                             </div>
  151.                             <div class="quesUser">
  152.                                 <image src="data:images/0.gif" class="imguser" />
  153.                                 <div class="userName">
  154.                                     张大值
  155.                                     <div class="liulan">浏览(9) 30分钟前</div>
  156.                                 </div>
  157.  
  158.                             </div>
  159.                         </div>
  160.                     </div>
  161.  
  162.                 </div>
  163.                 <div class="tab hidden">2</div>
  164.                 <div class="tab hidden">3</div>
  165.                 <div class="tab hidden">4</div>
  166.             </div>
  167.         </div>
  168.         <div class="dvquesright">
  169.             <div>
  170.                 <buton class="btnques" onclick="location.href='add.html'">提个问题</buton>
  171.             </div>
  172.  
  173.             <div class="dvorder">
  174.  
  175.                 <dl class="fly-panel fly-list-one">
  176.                     <dt class="fly-panel-title">最近热帖</dt>
  177.                     <dd>
  178.                         <a href="">使用 layui 秒搭后台大布局（基本结构）</a>
  179.                         <span>
  180.                             <i class="iconfont"></i>
  181.                             6087
  182.                         </span>
  183.                     </dd>
  184.                     <dd>
  185.                         <a href="">Java实现LayIM后端的核心代码</a>
  186.                         <span>
  187.                             <i class="iconfont"></i>
  188.                             767
  189.                         </span>
  190.                     </dd>
  191.                     <dd>
  192.                         <a href="">使用 layui 秒搭后台大布局（基本结构）</a>
  193.                         <span>
  194.                             <i class="iconfont"></i>
  195.                             6087
  196.                         </span>
  197.                     </dd>
  198.                     <dd>
  199.                         <a href="">Java实现LayIM后端的核心代码</a>
  200.                         <span>
  201.                             <i class="iconfont"></i>
  202.                             767
  203.                         </span>
  204.                     </dd>
  205.                     <dd>
  206.                         <a href="">使用 layui 秒搭后台大布局（基本结构）</a>
  207.                         <span>
  208.                             <i class="iconfont"></i>
  209.                             6087
  210.                         </span>
  211.                     </dd>
  212.                     <dd>
  213.                         <a href="">Java实现LayIM后端的核心代码</a>
  214.                         <span>
  215.                             <i class="iconfont"></i>
  216.                             767
  217.                         </span>
  218.                     </dd>
  219.                     <dd>
  220.                         <a href="">使用 layui 秒搭后台大布局（基本结构）</a>
  221.                         <span>
  222.                             <i class="iconfont"></i>
  223.                             6087
  224.                         </span>
  225.                     </dd>
  226.                     <dd>
  227.                         <a href="">Java实现LayIM后端的核心代码</a>
  228.                         <span>
  229.                             <i class="iconfont"></i>
  230.                             767
  231.                         </span>
  232.                     </dd>
  233.                 </dl>
  234.  
  235.                 <dl class="fly-panel fly-list-one">
  236.                     <dt class="fly-panel-title">近期热议</dt>
  237.                     <dd>
  238.                         <a href="">使用 layui 秒搭后台大布局之基本结构</a>
  239.                         <span>
  240.                             <i class="iconfont"></i>
  241.                             96
  242.                         </span>
  243.                     </dd>
  244.                     <dd>
  245.                         <a href="">使用 layui 秒搭后台大布局之基本结构</a>
  246.                         <span>
  247.                             <i class="iconfont"></i>
  248.                             96
  249.                         </span>
  250.                     </dd>
  251.                     <dd>
  252.                         <a href="">使用 layui 秒搭后台大布局之基本结构</a>
  253.                         <span>
  254.                             <i class="iconfont"></i>
  255.                             96
  256.                         </span>
  257.                     </dd>
  258.                     <dd>
  259.                         <a href="">使用 layui 秒搭后台大布局之基本结构</a>
  260.                         <span>
  261.                             <i class="iconfont"></i>
  262.                             96
  263.                         </span>
  264.                     </dd>
  265.                     <dd>
  266.                         <a href="">使用 layui 秒搭后台大布局之基本结构</a>
  267.                         <span>
  268.                             <i class="iconfont"></i>
  269.                             96
  270.                         </span>
  271.                     </dd>
  272.                     <dd>
  273.                         <a href="">使用 layui 秒搭后台大布局之基本结构</a>
  274.                         <span>
  275.                             <i class="iconfont"></i>
  276.                             96
  277.                         </span>
  278.                     </dd>
  279.                     <dd>
  280.                         <a href="">使用 layui 秒搭后台大布局之基本结构</a>
  281.                         <span>
  282.                             <i class="iconfont"></i>
  283.                             96
  284.                         </span>
  285.                     </dd>
  286.                     <dd>
  287.                         <a href="">使用 layui 秒搭后台大布局之基本结构</a>
  288.                         <span>
  289.                             <i class="iconfont"></i>
  290.                             96
  291.                         </span>
  292.                     </dd>
  293.                 </dl>
  294.  
  295.                 <div class="orderTitle">专家排行榜</div>
  296.                 <div class="users">
  297.                     <image class="userface" src="data:images/0.gif" />
  298.                     <div class="dvuser">
  299.                         <div class="userTitle">陈有龙</div>
  300.                         <div class="userdeital">大牛6级 豆:14006</div>
  301.                     </div>
  302.                 </div>
  303.                 <div class="users">
  304.                     <image class="userface" src="data:images/1.gif" />
  305.                     <div class="dvuser">
  306.                         <div class="userTitle">陈有龙</div>
  307.                         <div class="userdeital">大牛6级 豆:14006</div>
  308.                     </div>
  309.                 </div>
  310.                 <div class="users">
  311.                     <image class="userface" src="data:images/2.gif" />
  312.                     <div class="dvuser">
  313.                         <div class="userTitle">陈有龙</div>
  314.                         <div class="userdeital">大牛6级 豆:14006</div>
  315.                     </div>
  316.                 </div>
  317.                 <div class="users">
  318.                     <image class="userface" src="data:images/3.gif" />
  319.                     <div class="dvuser">
  320.                         <div class="userTitle">陈有龙</div>
  321.                         <div class="userdeital">大牛6级 豆:14006</div>
  322.                     </div>
  323.                 </div>
  324.                 <div class="users">
  325.                     <image class="userface" src="data:images/4.gif" />
  326.                     <div class="dvuser">
  327.                         <div class="userTitle">陈有龙</div>
  328.                         <div class="userdeital">大牛6级 豆:14006</div>
  329.                     </div>
  330.                 </div>
  331.                 <div class="users">
  332.                     <image class="userface" src="data:images/5.gif" />
  333.                     <div class="dvuser">
  334.                         <div class="userTitle">陈有龙</div>
  335.                         <div class="userdeital">大牛6级 豆:14006</div>
  336.                     </div>
  337.                 </div>
  338.                 <div class="users">
  339.                     <image class="userface" src="data:images/6.gif" />
  340.                     <div class="dvuser">
  341.                         <div class="userTitle">陈有龙</div>
  342.                         <div class="userdeital">大牛6级 豆:14006</div>
  343.                     </div>
  344.                 </div>
  345.  
  346.             </div>
  347.  
  348.         </div>
  349.  
  350.     </div>
  351.     <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
  352.     <script type="text/javascript">
  353.         $(function() {
  354.  
  355.             $(".tabheads").click(
  356.                     function() {
  357.                         $(".tabheads").removeClass("tabcurrent").eq(
  358.                                 $(this).index()).addClass("tabcurrent");
  359.                         $(".tab").hide().eq($(this).index()).show();
  360.                     });
  361.         });
  362.     </script>
  363.  
  364. </body>
  365. </html>

index.html

  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5. <meta charset="UTF-8">
  6.  
  7. <link rel="stylesheet" href="css/head.css" />
  8. <link rel="stylesheet" type="text/css" href="css/login.css" />
  9. </head>
  10.  
  11. <body style="margin: -2px">
  12.  
  13.     <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  14.  
  15.     <section class="sec">
  16.         <form action="UserLoginServlet" method="post">
  17.             <div class="register-box">
  18.                 <label for="username" class="username_label"> 用 户 名 <input maxlength="20" name="userName" type="text" placeholder="您的用户名和登录名" />
  19.                 </label>
  20.                 <div class="tips"></div>
  21.             </div>
  22.             <div class="register-box">
  23.                 <label for="username" class="other_label"> 密 码 <input maxlength="20" type="password" name="pwd" placeholder="建议至少使用两种字符组合" />
  24.                 </label>
  25.                 <div class="tips"></div>
  26.             </div>
  27.             <div class="arguement">
  28.                 <input type="checkbox" id="xieyi" /> 阅读并同意 <a href="javascript:void(0)">《你问我答用户注册协议》</a> <a href="register.html">没有账号,立即注册</a>
  29.                 <div class="tips"></div>
  30.             </div>
  31.             <div class="submit_btn">
  32.                 <button type="submit" id="submit_btn">立 即 登录</button>
  33.             </div>
  34.         </form>
  35.     </section>
  36.     <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
  37. </body>

login.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <link rel="stylesheet" type="text/css" href="css/login.css" />
  7. <link rel="stylesheet" href="css/head.css" />
  8. </head>
  9.  
  10. <body style="margin: -2px">
  11. <iframe src="head.html" scrolling="no" width="100%" height="110px"></iframe>
  12.     <section class="sec">
  13.         <form action="UserRegServlet" method="post">
  14.             <div class="register-box">
  15.  
  16.                 <label for="username" class="username_label"> 用 户 名 <input maxlength="20" name="userName" type="text" placeholder="您的用户名和登录名" />
  17.                 </label>
  18.                 <div class="tips"></div>
  19.             </div>
  20.             <div class="register-box">
  21.                 <label for="username" class="other_label"> 设 置 密 码 <input maxlength="20" type="password" name="pwd" placeholder="建议至少使用两种字符组合" />
  22.                 </label>
  23.                 <div class="tips"></div>
  24.             </div>
  25.             <div class="register-box">
  26.                 <label for="username" class="other_label"> 确 认 密 码 <input maxlength="20" type="password" placeholder="请再次输入密码" />
  27.                 </label>
  28.                 <div class="tips"></div>
  29.             </div>
  30.  
  31.             <div class="register-box">
  32.                 <label for="username" class="username_label"> 真实姓名 <input maxlength="20" name="userName" type="text" placeholder="您的真实姓名" />
  33.                 </label>
  34.                 <div class="tips"></div>
  35.             </div>
  36.             <div class="register-box">
  37.                 <label for="username" class="username_label"> 邮箱 <input maxlength="20" name="userName" type="text" placeholder="您的邮箱" />
  38.                 </label>
  39.                 <div class="tips"></div>
  40.             </div>
  41.             <div class="register-box">
  42.                 <label for="username" class="username_label"> 手机号 <input maxlength="20" name="userName" type="text" placeholder="您的手机号" />
  43.                 </label>
  44.                 <div class="tips"></div>
  45.             </div>
  46.             <div class="arguement">
  47.                 <input type="checkbox" id="xieyi" /> 阅读并同意 <a href="javascript:void(0)">《错题用户注册协议》</a> <a href="login.html">已有账号,立即登录</a>
  48.                 <div class="tips"></div>
  49.             </div>
  50.             <div class="submit_btn">
  51.                 <button type="submit" id="submit_btn">立 即 注 册</button>
  52.             </div>
  53.         </form>
  54.     </section>
  55.     <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
  56. </body>
  57. </html>

register.html

JavaWeb_(SSH论坛)_一、项目入门的更多相关文章

  1. JavaWeb_(SSH论坛)_七、辅助模块

    基于SSH框架的小型论坛项目 一.项目入门 传送门 二.框架整合 传送门 三.用户模块 传送门 四.页面显示 传送门 五.帖子模块 传送门 六.点赞模块 传送门 七.辅助模块 传送门 为避免代码冗余, ...

  2. JavaWeb_(SSH论坛)_六、点赞模块

    基于SSH框架的小型论坛项目 一.项目入门 传送门 二.框架整合 传送门 三.用户模块 传送门 四.页面显示 传送门 五.帖子模块 传送门 六.点赞模块 传送门 七.辅助模块 传送门 联合主键 创建p ...

  3. JavaWeb_(SSH论坛)_五、帖子模块

    基于SSH框架的小型论坛项目 一.项目入门 传送门 二.框架整合 传送门 三.用户模块 传送门 四.页面显示 传送门 五.帖子模块 传送门 六.点赞模块 传送门 七.辅助模块 传送门 回复帖子 分析回 ...

  4. JavaWeb_(SSH论坛)_四、页面显示

    基于SSH框架的小型论坛项目 一.项目入门 传送门 二.框架整合 传送门 三.用户模块 传送门 四.页面显示 传送门 五.帖子模块 传送门 六.点赞模块 传送门 七.辅助模块 传送门 帖子表与回复表 ...

  5. JavaWeb_(SSH论坛)_三、用户模块

    基于SSH框架的小型论坛项目 一.项目入门 传送门 二.框架整合 传送门 三.用户模块 传送门 四.页面显示 传送门 五.帖子模块 传送门 六.点赞模块 传送门 七.辅助模块 传送门 User表 id ...

  6. JavaWeb_(SSH论坛)_二、框架整合

    基于SSH框架的小型论坛项目 一.项目入门 传送门 二.框架整合 传送门 三.用户模块 传送门 四.页面显示 传送门 五.帖子模块 传送门 六.点赞模块 传送门 七.辅助模块 传送门 导入Jar包 导 ...

  7. 转 Katana 项目入门

    Katana 项目入门 Howard Dierking 当 ASP.NET 首次在 2002 年发布时,时代有所不同. 那时,Internet 仍处于起步阶段,大约有 5.69 亿用户,每个用户平均每 ...

  8. 在MyEclipse下创建Java Web项目 入门（图文并茂）经典教程

    http://jijiaa12345.iteye.com/blog/1739754 在MyEclipse下创建Java Web项目 入门(图文并茂)经典教程 本文是一篇在Myeclipse下构建Jav ...

  9. Intellij Idea 创建Web项目入门（一）转

    Intellij Idea 创建Web项目入门(一) 相关软件: Intellij Idea14:http://pan.baidu.com/s/1nu16VyD JDK7:http://pan.bai ...

随机推荐

  1. 启动Tomcat

    这篇随笔的重点关注启动Tomcat时会用到的两个类,分别是Catalina类 和 Bootstrap类,它们都位于org.apache.catalina.startup包下,Catalina类用于启动 ...

  2. opencv3.3.1 + win64 + contrib + cuda 编译

    一 . opencv3.3.1  + win64 + contrib + cuda   编译 1.下载各种依赖 下载安装cuda  https://developer.nvidia.com/cuda- ...

  3. 测试使用Timer定时调用http接口

    转自:https://blog.csdn.net/qq_36004521/article/details/80101881

  4. 卡片拖拽（vue拖拽事件）

    <template> <div class="wrapper wrapper-content" id="main" v-cloak> & ...

  5. kubesphere-wokespaces

    kubesphere  - workspaces  详解: workspaces :企业空间 登陆kubesphere后,会看到一个默认的企业空间 " system-workspace &q ...

  6. C++归并排序（数组&链表）

    1.归并排序(Merge Sort) 归并排序的性能不受输入数据的影响,始终都是O(n log n)的时间复杂度.代价是需要额外的内存空间. 归并排序是建立在归并操作上的一种有效的排序算法.该算法是采 ...

  7. python日志分割(转)

    按文件大小分割:RotatingFileHandler 按时间分割:TimedRotatingFileHandler import logging from logging.handlers impo ...

  8. shell脚本基础和grep文本处理工具企业应用4

    文本处理工具:    egrep:        支持扩展的正则表达式实现类似于grep文本过滤功能:grep -E        egrep [OPTIONS] PATTERN [FILE...]  ...

  9. C++虚函数作用原理（一）——虚函数如何在C++语言逻辑中存在

    C++多态,接触其实也没太长的时间.上课的时候老师总是不停的讲,多态可以实现利用一个基类对象调用不同继承类的成员函数.我就会觉得很伤脑筋,这个的原理到底是什么?是什么呢? 开始的时候我觉得自己应该能够 ...

  10. Zabbix使用Pycurl模块监控web页面状态

    由于网络的问题,zabbix自带web模块用不了,后台研发2b,老是更新正式环境安装包,导致一直出问题,老是给他们擦屁股,早说过这事,他们不配合,现在出问题了,挺爽,这锅我表示不背,就找了pycurl ...