現代網站大多使用CSS來定義頁面樣式，這是使網站外觀和布局與內容分離的關鍵技術。CSS中的各種屬性和值可以與HTML結構相結合，使開發人員創建出完全自定義的網站設計。
/* 使用CSS定義樣式 */
body {
font-family: sans-serif;
background-color: #f1f1f1;
}
h1 {
color: #333;
font-size: 30px;
text-align: center;
}
.box {
width: 200px;
height: 200px;
background-color: #fff;
margin: 50px auto;
border: 1px solid #ccc;
}上面的示例代碼是一個典型的CSS規則。第一行指定選擇器（這里是body），接下來的行定義該選擇器表示的元素的屬性和值。例如，body元素的字體將是sans-serif，顏色為#f1f1f1。需要注意的是，屬性和值之間使用冒號分隔，不同的屬性之間使用分號分隔。
然后，我們看到另一個示例，其中展示了CSS類。類名需要使用點前綴（如.box），可以應用于任何元素。此示例中的.box類將應用于一個 DIV 元素，在此期間指定的任何樣式將僅適用于該元素及其后代元素，而不適用于其他元素。
<body><h1>我是標題</h1><div class="box">這是一個 div 元素</div></body>
最后，我們需要記住的是，CSS還可以使用媒體查詢、偽類和偽元素等高級功能。這些功能可以面向不同的設備或用戶，或者根據HTML文檔中元素的狀態或位置，提供特定的樣式效果。