静态H5聊天输入对话框html代码（1）

静态H5聊天输入对话框html代码

最近因项目需要做一个android app上面的嵌入一个聊天功能，聊天功能现在是第一版，只需要我们的mm支持客服与用户聊。如果是native开发那就太麻烦了，开发时间长。如果是h5开发应该比较快，关键是可以跨平台，那就不用在安卓苹果电脑上再重新开发一次。下面我将讲述如果用html开发一款聊天的网页程序。废话不说了，先上图。

上图中就是电脑上运行效果，这里是基本框架，还没有开发实际与服务器交互的功能，只实现简单的发送文字等UI的css样式布局，右边的常见问题，可以写上常见的客户遇到问题，用户点后，直接发送到聊天框中，这样体验会更好。

目前代码还没有上传到csdn，获取代码可以+扣 773179801，大家一起讨论。

下面说一下网页的适配。适配上面要合理使用css样式适配电脑和手机样式。它是通过@media媒介查询判断来执行的CSS样式，也就是说：如果我要做一个响应式布局网站，同时兼容手机、平板、PC的话就得写三个与之对应的CSS样式，通过@media媒介查询来完成响应式布局。
值得注意的是：在手机设备上，我们要禁止用户来缩放屏幕。不禁止的话，可能在显示上会造成错位，以及显示的不是手机网站的样式。所以，我们要通过代码来禁止用户在手机端上