CSS（層疊樣式表）是網頁設計和開發中不可或缺的一部分。它用于定義網頁中的樣式和布局。如果您是CSS的新手，以下是您需要掌握的一些基礎知識。

p {
font-size: 16px;
color: navy;
}

1. HTML與CSS分離

在開發網頁時，您應該將HTML和CSS分離。HTML用于內容，CSS用于樣式。這樣可以提高代碼可讀性和維護性。

<link rel="stylesheet" href="styles.css">

2. CSS樣式的語法

CSS樣式由選擇器和聲明組成。選擇器選擇要應用樣式的HTML元素，聲明定義要應用的樣式。

p {
font-size: 16px;
color: navy;
}

3. 選擇器

常見的選擇器包括標簽選擇器、類選擇器和ID選擇器。標簽選擇器選中匹配指定標簽的所有元素，類選擇器選中匹配指定類名的所有元素，ID選擇器選中匹配指定ID的元素。

p {
font-size: 16px;
}
.highlight {
color: red;
}
#header {
background-color: gray;
}

4. 盒模型

CSS布局是基于盒模型的，每個HTML元素都可以視為一個盒子。盒模型由元素的內容、內邊距、邊框和外邊距組成。您可以使用CSS樣式修改每個盒子的屬性。

.box {
width: 100px;
height: 100px;
padding: 10px;
border: 1px solid black;
margin: 10px;
}

5. 浮動和定位

浮動和定位是常用的CSS布局技術。浮動將元素從文檔中流動位置中移動，并形成一行或多行。相對定位將元素移動相對于其原始位置，并可以覆蓋其他元素的位置。絕對定位將元素定位到父元素的位置，并根據指定位置調整其大小和位置。

.float {
float: left;
}
.relative {
position: relative;
left: 10px;
top: 10px;
}
.absolute {
position: absolute;
right: 0;
bottom: 0;
}

總之，掌握CSS的基礎知識對于網頁開發至關重要。了解HTML與CSS的分離、CSS樣式的語法、選擇器、盒模型、浮動和定位等基礎知識，將為您開展更高效的網頁設計和開發奠定堅實的基礎。