流式布局 及 媒体查询

流式布局

.outbox {
    display: flex; 
    flex-wrap: wrap; //换行
}
.d_item {
     255px; //固定宽度
    /* height: 120px; */
    background: #ffffff;
    border-radius: 3px;
    padding: 14px 0px 20px 20px;
    /* box-sizing: border-box; */
    /* float: left; */
    /* margin-left: 22px; */
    margin: 10px; // 上下左右间距

}

 媒体查询

@media screen and (max-480px){
 .ads {
   display:none;
  }
}

@media screen and (min-600px) and (max-900px){
  body {background-color:#f5f5f5;}
}

上面代码表示的是：样式代码将被使用在除打印设备和设备宽度小于1200px下所有设备中。
@media not print and (max- 1200px){样式代码}