如何解决PC端和移动端自适应问题？

宽度自适应：

关于最小宽度和最大宽度

//html部分
<div id='container'>
    <div class='one'></div>
    <div class='two'></div>
    <div class='three'></div>
 </div>

//css部分
#container{100%;}
.one{20%;background:red；}
.one,.two,.three{float:left; height:100px;}
.two{60%;background:yellow;}
.three{20%;background:blue;}
@media (max-800px){ //--如果浏览器小于800px
  .one{40%;}
  .two{60%}
  .three{100%}
}
@media (max-400px) //--如果浏览器宽度小于400px
{
   .one{100%}
   .two{100%}
   .three{100%}
  
}

理解什么叫最小宽度和最大宽度，最小宽度指为元素设置的最小宽度，到达最小宽度后，缩放文本不会起到任何作用
最大宽度是所有元素所能达到的一个上限，不能再继续往上增加。

如何理解主流浏览器：