CSS是現代網頁設計的核心技術之一，是指層疊樣式表。在頁面開發的過程中，為了能有效地實現樣式的定義和管理，我們需要給頁面的HTML元素指定相應的類名。下面是一些我們推薦使用的類名：

/* 頁面主體布局 */
.layout {
display: flex;
flex-wrap: wrap;
}
/* 頂部導航欄 */
.nav {
display: flex;
justify-content: space-between;
align-items: center;
}
/* 頁面主要內容區域 */
.content {
flex: 1;
padding: 20px;
}
/* 左側邊欄 */
.sidebar {
width: 300px;
margin-right: 20px;
}
/* 右側邊欄 */
.sidebar-right {
width: 200px;
margin-left: 20px;
}
/* 模態框 */
.modal {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 999;
}
/* 登錄表單 */
.form-login {
display: flex;
flex-direction: column;
max-width: 400px;
}
/* 按鈕 */
.btn {
display: inline-block;
padding: 10px 20px;
border-radius: 5px;
background-color: #007bff;
color: #fff;
cursor: pointer;
}
/* 鏈接 */
a {
color: #007bff;
text-decoration: none;
}
/* 文本顏色 */
.text-primary {
color: #007bff;
}
/* 背景顏色 */
.bg-primary {
background-color: #007bff;
}

以上是我們推薦使用的一些類名，當然在實際開發中，根據實際需求還可以有更多的類名定義。希望這個小小的技巧能夠對你在網頁開發中更方便地實現樣式的定義和管理有所幫助。