.pageView { display: flex; background-color: #f5f5f5; } .body { display: flex; flex-direction: column; height: 100vh; width: 50%; background-color: #f5f5f5; } /* 头部 */ .head { height: 100rpx; background-color: #f5f5f5; text-align: center; line-height: 100rpx; } /* 主内容区 */ .list-wrap { flex-grow: 1; position: relative; } .scrollview { position: absolute; height: 100%; .scrollview-item { display: flex; flex-direction: column; .item { display: flex; margin: 0 24rpx 50rpx; } .avtar { display: flex; width: 78rpx; height: 78rpx; border-radius: 50rpx; overflow: hidden; } .content { position: relative; max-width: 750rpx; background-color: #fff; margin: 40rpx 24rpx 0; border-radius: 5px; font-size: 32rpx; line-height: 42rpx; padding: 24rpx; word-wrap: break-word; } .other { justify-content: flex-end; } } } /* 底部发送框 */ .chat-bottom { height: 300rpx; margin: 50rpx; position: relative; .send-msg { display: flex; .uni-textarea { flex: 1; textarea { width: 100%; height: 270rpx; border-radius: 40rpx; line-height: 1.5; padding: 25rpx; right: 50rpx; background-color: #fff; } textarea ::-webkit-scrollbar { display: none; } } .send-btn { align-items: center; justify-content: center; width: 320rpx; height: 320rpx; border-radius: 50rpx; font-size: 35rpx; font-weight: 500; color: #fff; line-height: 320rpx; } } } .sidebar-left { height: 100vh; width: 20%; } .sidebar-right { height: 100vh; width: 30%; image { display: inline-block; height: 400px; left: 8%; top: 48%; } } /* 去除导航条 */ .scrollview ::-webkit-scrollbar { display: none; }