商丘12345 前端

chatWith.html 2.6KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <script src="./Script/Common/huayi.load.js"></script>
  6. <script src="./Script/Common/huayi.config.js"></script>
  7. <link rel="stylesheet" href="css/init.css" />
  8. <link rel="stylesheet" href="css/chat.css" />
  9. <title>聊天窗口</title>
  10. </head>
  11. <body>
  12. <div id="chat">
  13. <div class="chat_left">
  14. <ul>
  15. </ul>
  16. </div>
  17. <div class="chat_sidebar">
  18. <div class="pic_card">
  19. <div class="chat_sidebar_head">
  20. <img class="ver_middle" src="img/chat_pic.jpg" alt="" width="40" height="40" />
  21. <p class="chat_name">Coffce</p>
  22. </div>
  23. <div class="chat_sidebar_foot">
  24. <input type="text" class="sidebar_foot_seach" placeholder="search user..." />
  25. </div>
  26. </div>
  27. <div class="chat_sidebar_list">
  28. <ul>
  29. <!--<li class="actives">
  30. <img class="ver_middle" src="img/chat_list1.png" alt="" width="30" height="30"/>
  31. <p class="chat_name">技术-小白</p>
  32. </li>
  33. <li>
  34. <img class="ver_middle" src="img/chat_list2.jpg" alt="" width="30" height="30"/>
  35. <p class="chat_name">WebPack</p>
  36. </li>-->
  37. </ul>
  38. </div>
  39. </div>
  40. <div class="chat_main">
  41. <div class="chat_person disnone">
  42. <p class="chat_name"></p>
  43. </div>
  44. <div class="main_message">
  45. <ul class="chatlist_con">
  46. <!--<li>
  47. <p class="message_time"><span>10:00</span></p>
  48. <div class="message_mincon">
  49. <img class="ver_middle" src="img/chat_list1.png" alt="" width="30" height="30"/>
  50. <div class="message_text">
  51. Hello,这是一个基于Vue + Webpack构建的简单chat示例,聊天记录保存在localStorge。简单演示了Vue的基础特性和webpack配置。
  52. </div>
  53. </div>
  54. </li>
  55. <li>
  56. <p class="message_time"><span>10:00</span></p>
  57. <div class="message_mincon self">
  58. <img class="ver_middle" src="img/chat_pic.jpg" alt="" width="30" height="30"/>
  59. <div class="message_text">
  60. 我知道吖
  61. </div>
  62. </div>
  63. </li>-->
  64. </ul>
  65. </div>
  66. <div class="main_sendMessage disnone">
  67. <textarea name="" rows="" cols="" placeholder="按Enter 发送" class="send_content"></textarea>
  68. <div class="send_btn">
  69. <button class="sendTo">发送(S)</button>
  70. </div>
  71. </div>
  72. </div>
  73. <input type="hidden" class="IsToAll" value="1"/>
  74. <input type="hidden" class="RoleId" value="0"/>
  75. <input type="hidden" class="UserId" value="0"/>
  76. </div>
  77. <script src="./js/chat.js"></script>
  78. </body>
  79. </html>