ie10和11可用
例如ie不能正确表现grid 可以在下边重写
.div1{
width: 100%;
height: 200px;
background: linear-gradient(to right, #e6ffd8, #d8dcff);
/* display: -ms-grid;
-ms-grid-columns: 1fr 1fr 1fr 1fr;
-ms-grid-rows: 100%; */
display: grid;
grid-template-columns: repeat(auto-fill, 200px);
grid-template-rows: 100%;
}
@media all and (-ms-high-contrast:none), (-ms-high-contrast: active) {
.div1{
display: flex;
}
}
以下写法,ie10下 item2宽度不能压缩到一行去
<div class="div1">
<div class="item2 bg-red">item1</div>
<div class="item2 bg-blue">item2</div>
<div class="item2 bg-green">item3</div>
</div>
.item2{
width: 100%;
height: 100%;
}