在做網站的過程中，通常會設計多個頁面，那么如何添加子頁面呢？這時候，我們就需要使用CSS來實現。

/*示例代碼*/
nav {
display: flex;
justify-content: center;
}
nav a {
padding: 10px;
margin: 0 10px;
text-decoration: none;
color: #000;
}
nav a:hover {
background-color: #000;
color: #fff;
}

在上述代碼中，我們使用了flex布局來使得導航欄居中顯示，同時給每個導航鏈接添加樣式。當鼠標懸浮在導航鏈接上時，會改變背景顏色和文字顏色。

接下來，我們就需要針對每個頁面設置不同的樣式，可以使用class或者id來進行選擇。

/*示例代碼*/
.home {
background-color: #eee;
}
.about {
background-color: #ccc;
}
.contact {
background-color: #aaa;
}

在上述代碼中，我們分別針對home、about和contact頁面設置了不同的背景顏色。我們可以將這些樣式抽離出來，放在一個單獨的CSS文件中，然后在網頁中引入即可，這樣可以使得我們的代碼更加簡潔易懂。

總之，使用CSS設計網站子頁面需要考慮頁面布局、樣式以及選擇器的使用，通過不斷的嘗試和實踐，我們可以設計出更加美觀、實用的網站。