實例運用：
<!DOCTYPE html>
<html>
<head>
<title>自動跳轉頁面</title>
</head>
<style>
html, body {
padding: 0;
margin: 0;
font-size: 30px;
color: rgb(241, 245, 35);
}
.wrap {
display: grid;
width: 600px;
height: 600px;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr 1fr;
border: 1px solid red;
}
.a1 {
grid-row-start: 1;
grid-row-end: 4;
grid-column-start: 1;
grid-column-end: 2;
background-color: rgb(100, 20, 51);
}
.a5 {
grid-row-start: 2;
grid-row-end: 3;
grid-column-start: 2;
grid-column-end: 4;
background-color: seagreen;
}
.a2, .a3, .a4, .a6 {
color: steelblue;
}
</style>
<script></script>
<body>
<article class="wrap">
<div class="a1">a1</div>
<div class="a2">a2</div>
<div class="a3">a3</div>
<div class="a4">a4</div>
<div class="a5">a5</div>
<div class="a6">a6</div>
</article>
</body>
</html>
