scss CSS Grid Basic语法

Posted 2021-05-17

.container {
  display: grid;
  grid-template-columns: 2fr 6fr 2fr;
  grid-template-rows: 1fr;
  display: -ms-grid;
  -ms-grid-columns: 2fr 6fr 2fr;
  -ms-grid-rows: 1fr;
  .item1 {
    grid-row: 1;
    grid-column: 1;
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .item2 {
    grid-row: 1;
    grid-column: 2;
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .item3 {
    grid-row: 1;
    grid-column: 3;
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
}