@media screen页面自适应尺寸！！

@media screen页面自适应尺寸！！

@media screen and (max-width:360px){body,input,select{font-size:38%}}@media screen and (min-width:360px){body,input,select{font-size:15.75px}}@media screen and (min-width:400px){body,input,select{font-size:17.5px}}@media screen and (min-width:480px){body,input,select{font-size:21px}}@media screen and (min-width:560px){body,input,select{font-size:24.5px}}@media screen and (min-width:600px){body,input,select{font-size:26.25px}}@media screen and (min-width:640px){body,input,select{font-size:62.5%}}

HTML头部引用实现自适应屏幕：

<meta name="viewport" content="width=device-width; initial-scale=1.0; minimum-scale=1.0; maximum-scale=1.0, user-scalable=no" />

CSS头部引用实现判断屏幕自适应：

最终更新后（推荐）：

body{font-family:"微软雅黑";color:#000;font-size:62.5%;margin:0 auto; }@media screen and (min-width:480px) and (max-width:639px){body{font-size:50%;}}@media screen and (max-width:479px){body{font-size:40%;}}

一下个人理解：

max-width{宽度的最大值==小于当前宽度}

min-width{宽度的最小值==大于当前宽度}