HTML5 的媒体查询用多了好么？

Question

HTML5的媒体查询有哪些优缺点，有的人认为最好不用。但是做页面的时候为了兼容iPhone5和6plus，经常用到啊。
谁对此有比较全面的讲解？

Answer 1

手机移动端最好还是用em、%和rem，媒体查询做不到全面兼容，而且维护和开发成本高。

Answer 2

移动端页面添加上下面的meta<meta&nbsp;name="viewport"&nbsp;content="width=device-width,&nbsp;initial-scale=1"&nbsp;/>如果要禁止用户的缩放，请自行查询文档后添加然后尽量不要使用px作为单位，除了border-width, outline-width, border-radius等只需要微量单位的属性外，多使用em, %, rem做单位, 尤其是字体。这种处理是不需要媒体查询的，真正用到媒体查询的东西不会太多的，主要是在布局上可能会有些媒体查询的东西存在。

Answer 3

媒体查询配合rem使用。@media only screen and (min-width: 340px){&nbsp; html {&nbsp; &nbsp; font-size: 20px !important;&nbsp; }}@media only screen and (min-width: 401px){&nbsp; html {&nbsp; &nbsp; font-size: 25px !important;&nbsp; }}@media only screen and (min-width: 428px){&nbsp; html {&nbsp; &nbsp; font-size: 26.75px !important;&nbsp; }}@media only screen and (min-width: 481px){&nbsp; html {&nbsp; &nbsp; font-size: 30px !important;&nbsp; }}@media only screen and (min-width: 569px){&nbsp; html {&nbsp; &nbsp; font-size: 35px !important;&nbsp; }}@media only screen and (min-width: 641px){&nbsp; html {&nbsp; &nbsp; font-size: 40px !important;&nbsp; }}然后html里面的DOM根据html来设定大小，宽度，高度。