Layim是一个基于Layui框架的即时通讯系统，提供了一套完整的即时通讯功能，包括用户登录、好友列表、聊天界面等。
以下是Layim的完整实例：
< !DOCTYPE html>
< html>
< head>
< meta charset="utf-8">
< title> Layim Instant Messaging< /title>
< link rel="stylesheet" href="layui/css/layui.css">
< style> body { margin: 20px; } < /style>
< /head>
< body>
< div class="layui-layout layui-layout-admin">
< div class="layui-header">
< div class="layui-logo"> Layim Instant Messaging< /div>
< ul class="layui-nav layui-layout-left">
< li class="layui-nav-item"> < a href=""> 个人中心< /a> < /li>
< li class="layui-nav-item"> < a href=""> 消息< span class="layui-badge"> 9< /span> < /a> < /li>
< li class="layui-nav-item"> < a href=""> 更多< /a> < /li>
< /ul>
< ul class="layui-nav layui-layout-right">
< li class="layui-nav-item">
< a href="javascript:; "> admin< /a>
< dl class="layui-nav-child">
< dd> < a href=""> 基本设置< /a> < /dd>
< dd> < a href=""> 安全设置< /a> < /dd>
< dd> < a href=""> 退出< /a> < /dd>
< /dl>
< /li>
< /ul>
< /div>
< div class="layui-body">
< div class="layui-tab layui-tab-brief">
< ul class="layui-tab-title">
< li class="layui-this"> 好友列表< /li>
< li> 聊天界面< /li>
< /ul>
< div class="layui-tab-content">
< div class="layui-tab-item layui-show">
< ul class="layui-timeline">
< li class="layui-timeline-item">
< i class="layui-icon layui-timeline-axis"> & #xe63f; < /i>
< div class="layui-timeline-content layui-text">
< h3 class="layui-timeline-title"> 2018年12月< /h3>
< /div>
< /li>
< li class="layui-timeline-item">
< i class="layui-icon layui-timeline-axis"> & #xe63f; < /i>
< div class="layui-timeline-content layui-text">
< h3 class="layui-timeline-title"> 2018年11月< /h3>
< /div>
< /li>
< li class="layui-timeline-item">
< i class="layui-icon layui-timeline-axis"> & #xe63f; < /i>
< div class="layui-timeline-content layui-text">
< h3 class="layui-timeline-title"> 2018年10月< /h3>
< /div>
< /li>
< /ul>
< /div>
< div class="layui-tab-item">
< ul class="layim-chat-main"> < /ul>
< div class="layim-chat-footer">
< div class="layui-unselect layim-chat-tool">
< span class="layui-icon layim-tool-face" title="选择表情"> & #xe60c; < /span>
< span class="layui-icon layim-tool-image" title="上传图片"> & #xe60a; < /span>
< span class="layui-icon layim-tool-file" title="上传附件"> & #xe609; < /span>
< /div>
< textarea class="layui-unselect layim-chat-textarea" placeholder="请输入内容"> < /textarea>
< div class="layui-unselect layim-chat-bottom">
< div class="layui-unselect layim-chat-send">
< span class="layui-btn layui-btn-primary"> 发送< /span>
< span class="layui-btn"> Ctrl+Enter< /span>
< /div>
< /div>
< /div>
< /div>
< /div>
< /div>
< /div>
< div class="layui-footer">
© 2022 Layim Instant Messaging
< /div>
< /div>
< script src="layui/layui.js"> < /script>
< script> layui.use(['element', 'layim'], function () { var element = layui.element; var layim = layui.layim; // 初始化Layim layim.init({ init: { mine: { username: 'admin', id: '1', status: 'online', avatar: 'http://www.layui.com/images/avatar.png' } } , brief: false } ); } ); < /script>
< /body>
< /html>