近年來，隨著網站的發展，div css 設計已成為網頁設計的主流。從網頁整體布局到細節設計，div css 都能幫助我們實現高質量的網頁設計。接下來，我們就通過一些實例來講述 div css 的應用。

/* 實例一：網頁布局 */
.container {
width: 960px;
margin: 0 auto;
}
.header {
height: 80px;
background-color: #333;
}
.content {
width: 700px;
float: left;
}
.sidebar {
width: 240px;
float: right;
}
.footer {
height: 100px;
background-color: #333;
}
/* 實例二：字體樣式 */
h1 {
font-size: 36px;
font-weight: bold;
color: #333;
text-align: center;
}
h2 {
font-size: 30px;
font-weight: bold;
color: #666;
}
p {
font-size: 16px;
line-height: 1.5;
color: #666;
}
a {
color: #0066cc;
text-decoration: none;
}
/* 實例三：按鈕樣式 */
.button {
display: inline-block;
padding: 8px 16px;
border-radius: 4px;
background-color: #0066cc;
color: #fff;
text-align: center;
cursor: pointer;
}
.button:hover {
background-color: #004a99;
}
/* 實例四：圖片樣式 */
img {
border-radius: 4px;
box-shadow: 0 0 5px #999;
max-width: 100%;
}
/* 實例五：表格樣式 */
table {
border-collapse: collapse;
width: 100%;
}
th, td {
border: 1px solid #ddd;
padding: 8px;
}
tr:nth-child(even) {
background-color: #f2f2f2;
}
tr:hover {
background-color: #ddd;
}

通過上述簡單的實例，我們可以看到 div css 設計的強大功能。希望大家能夠在實際網頁設計中善加利用，實現更好的用戶體驗。