以后遇到的问题都记录在这里。
1.由于先有的pc端后需求手机端，所以没有用框架做适配，而是手动媒体查询进行手机端、pad、pc 三端适配，界面比较简单，所以这么做也不复杂，就是坑比较多。
2.移动和pad我查的范围是1024px 到200px之间，用百分比+rem布局。
3.小屏幕的适配是通过一层容器定位实现铺满全屏，但这样做有两个问题 （1）底部链接和备案号 位置的固定 （2） 软键盘弹出会不会挤压界面大小
4.固定位置的元素我根据情况判断是否需要固定到底部（但我的这种做法不太科学） 是由于我只进行了一层元素的定位固定。然后导致上述问题的出现。
5.解决： （1）固定的元素要针对上一级固定，用z-index排列显示顺序。（2）软键盘挤压界面，曲线救国的方法，window触发resize事件的时候，隐藏固定在底部的元素。
6.兼容性: 360安全浏览器6.2版本是IE7的内核，样式有变化，表现在 阴影变的很大，input输入框光标位置不对，输入会出现黑×，可见 padding，margin这些没有生效，分析应该是盒模型差异导致的。
解决：<meta http-equiv="X-UA-Compatible" content="IE=edge"> 意思是强制使用最新版本的IE渲染。也试过8,9，但是回到IE浏览器就不行了。
结合input伪类 input::-ms-clear{ display:none;width:0;height:0} ::-ms-reveal{display: none;width:0;height:0;} 后边这个清除IE input的叹号。
7.华为某款大屏手机不支持transform：translateX（-50%） 对于这个情况 可以用margin-left：-50%； 解决，这就要考虑元素的宽度了。
8.overflow:hidden 属性在一些新手机上不支持，主要是 oppo r9splus + 锤子手机 这些有IE行为，-ms 修复。