在網(wǎng)站設(shè)計(jì)中，樣式是非常重要的一部分，使用CSS樣式表可以使網(wǎng)站的樣式更加統(tǒng)一且易于維護(hù)。下面給大家介紹一些CSS樣式表的實(shí)際案例。

body {
background-color: #f5f5f5;
}
.header {
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
}
.nav {
background-color: #ddd;
padding: 10px;
text-align: center;
}
.nav a {
color: #333;
font-size: 18px;
font-weight: bold;
text-decoration: none;
margin: 0 10px;
}
.content {
background-color: #fff;
margin: 20px;
padding: 20px;
}
.article {
border: 1px solid #ddd;
margin-bottom: 20px;
padding: 10px;
}
.article h2 {
font-size: 24px;
margin-top: 0;
}
.article p {
font-size: 18px;
line-height: 1.5;
}
.footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 10px;
}

上面的代碼展示了一個(gè)簡(jiǎn)單的網(wǎng)站布局CSS樣式表。整個(gè)網(wǎng)站的背景都是灰色的，頭部和底部的背景色都是深灰色，文字顏色都是白色。導(dǎo)航欄的背景顏色是淡灰色，字體顏色是黑色，大小為18px。網(wǎng)站主要內(nèi)容的背景色為白色，邊框?yàn)榈疑煮w大小為18px，行高為1.5。可以看出，通過(guò)CSS樣式表可以很方便地定義頁(yè)面上的元素樣式，使網(wǎng)站更加美觀、統(tǒng)一。