CSS媒体查询 @media

　　PC端和移动端自适应，自动换行

　　

 1 @media screen and (max-width: 850px) {      /*以下代码在屏幕小于850的情况下执行*/
 2             .dsad{     /*父类*/
 3                 display: flex;          /*flex布局*/
 4                 flex-wrap: wrap;        /*是否支持子类换行*/
 5             }
 6             .asdf{      /*子类*/
 7                 width: 100%;
 8                 order:1;             /*子类布局的先后顺序，数字越小，子类就在最前面*/
 9                 flex-grow: 1;        /*1表示独占一行，后面的都换行*/
10             }
11             .das{
12                 width: 100%;
13                 order:0;
14                 flex-grow: 4;
15             }
16         }