CSS Grid 在 IE 浏览器 兼容

现代浏览器 |  IE浏览器

display: grid; | display: -ms-grid;  //加前缀-ms

grid-template-columns: repeat(12, 1fr);  |  -ms-grid-columns: (1fr)[12]; //重复函数

grid-template-columns: 1fr repeat(3, 20px 1fr); |  -ms-grid-columns: 1fr (20px 1fr)[3];

grid-template-columns:100px   minmax(200px,500px)   1fr; | -ms-grid-columns:100px   minmax(200px,500px)   1fr; //minmax函数 
当值为auto时不起作用。minmax(50px,auto)

单元格占行:现代浏览器

grid-column:1/2;

grid-row:1/2;

单元格占行:IE浏览器

-ms-grid-column:1;

-ms-grid-column-span:1;

-ms-grid-row:1;

-ms-grid-row-span:1;


https://css-tricks.com/css-grid-in-ie-debunking-common-ie-grid-misconceptions/

你可能感兴趣的:(CSS Grid 在 IE 浏览器 兼容)