仿chatGPT或chatPDF的前端界面布局,css实现对话聊天布局代码,响应式左右分栏布局(附完整源代码)...
chatPDF或者chatGPT的界面挺简洁的,就是一个左侧的列表以及右侧的对话列表,现在使用css实现这样的布局充分运用了flex布局方式实现,左右分栏,以及对话形式展示效果下面是效果图:在手机设备看就隐藏左侧,右侧100%适应下面就是html和css的布局代码.chatpdf{display:flex;height:100vh;flex-direction:row;}.chatpdf.pann