html中如何设置适应手机端页面

1、转自https://blog.csdn.net/qq_38881495/article/details/83513246，自己记录一下
2、解决iphone的ios10下Meta设置user-scalable=no无效的方法：
用js加监听事件来阻止手动缩放，代码如下：

window.οnlοad=function () {  
        document.addEventListener('touchstart',function (event) {  
            if(event.touches.length>1){  
                event.preventDefault();  
            }  
        })  
        var lastTouchEnd=0;  
        document.addEventListener('touchend',function (event) {  
            var now=(new Date()).getTime();  
            if(now-lastTouchEnd<=300){  
                event.preventDefault();  
            }  
            lastTouchEnd=now;  
        },false)  
    } 

3、html的display:flex布局
display:flex
flex-wrap:wrap
width:33.3%，一行显示三个

float:left使用浮动，子元素宽度设置33.3%，也可以实现上面的布局
box-sizing:border-box

写在最后：

• 如果文章中有错误或是表达不准确的地方，欢迎大家评论中指正，以便我完善。
• 文章我也会根据所学到新的知识不断更新。