代碼：

.wrapper {/*類名*/
  display: grid;/*規定為網格屬性*/
  grid-template-columns: repeat(3, 1fr);/*定義的行名稱和跟蹤的大小功能網格列*//*repeat重復布局 repeat(3, 1fr)效果等同於1fr 1fr 1fr */
  grid-gap: 10px;/*此屬性用來創建列與列，行與行之間的間距，只設置了一個值，表示行和列的間距相等*/
  grid-auto-rows: minmax(100px, auto);/*屬性指定隱式創建的網格行跟蹤的大小，通過顯式定位到超出範圍的行，或者通過自動布局算法創建額外的行來實現。*//*minmax定義大於或等於 min 且小於或等於 max 的大小範圍。在此最小為100像素，最大為自適應
 
*/
}
.one {
  grid-column: 1 / 3; /*規定網格中每個列的寬度*//*1/3表示從第一格網格線開始，到第三網格線為止*/
  grid-row: 1;        /*規定網格中每個列的高度*/
}
.two { 
  grid-column: 2 / 4;
  grid-row: 1 / 3;
}
.three {
  grid-column: 1;
  grid-row: 2 / 5;
}
.four {
  grid-column: 3;
  grid-row: 3;
}
.five {
  grid-column: 2;
  grid-row: 4;
}
.six {
  grid-column
 
: 3;
  grid-row: 4;
}

第三周web作業2：grid layout