在網頁設計過程中，CSS樣式表是必不可少的一環。好的CSS代碼能夠使頁面呈現更優美、簡潔、易讀的效果。以下是一些設計CSS代碼的建議：

/* 將CSS樣式表分塊 */
/* 全局樣式 */
body {
font-family: Arial, sans-serif;
color: #333;
background-color: #fff;
}
/* 柵格系統 */
.container {
width: 90%;
margin: 0 auto;
padding: 1rem;
}
.col {
float: left;
width: 100%;
}
@media screen and (min-width: 768px) {
.col {
width: 50%;
float: left;
}
}
/* 頭部 */
.header {
background-color: #333;
color: #fff;
}
/* 主體 */
.main {
background-color: #fff;
}
/* 底部 */
.footer {
background-color: #777;
color: #fff;
}
/* 重用樣式 */
.btn {
display: inline-block;
padding: 0.5rem 1rem;
background-color: #333;
color: #fff;
text-align: center;
text-decoration: none;
border-radius: 0.25rem;
}
.btn:hover {
background-color: #666;
}

將CSS樣式表分成一些塊能夠使頁面布局更加清晰。如上CSS代碼就將全局樣式、柵格系統、頭部、主體、底部和重用樣式等分成多個塊。這不僅有助于組織代碼和提高代碼重用性，還方便閱讀和調試。

另外，注釋也是設計CSS代碼中非常重要的。用注釋來解釋每一個塊的作用，讓代碼變得更加易讀和易理解。上面的例子中，在每個塊的開始都添加了注釋，以便其他開發者可以快速了解這個塊的作用。

最后，使用命名規則能夠使CSS代碼更有層次、邏輯和可維護性。有一個比較通用的命名規則就是BEM(Block Element Modifiers)。這個規則基于塊、元素和修飾符三個概念，每個選擇器名稱都非常清晰、易理解。例如在上面的CSS示例中，".header"是一個塊，".header__logo"是一個元素，".header--fixed"是一個修飾符。