CSS具有層疊的特性，這意味著我們可以同時設置多個屬性，這些屬性會相互影響并產生相應的效果。CSS的屬性包括：

1. 選擇器(CSS選擇器)：選擇器用于選擇網頁中的元素，包括id、class、type等。

2. 樣式(CSS樣式)：樣式用于定義元素的樣式，包括字體、顏色、大小、位置等。

3. 布局(CSS布局)：布局用于決定網頁中元素如何排列和顯示，包括 float、position、對齊方式等。

下面我們將深入探討CSS的基本概念和使用方法。

1. 選擇器

選擇器是CSS中最基本的部分，用于選擇網頁中的元素。選擇器包括：

- id選擇器：用于選擇具有特定id屬性的元素。

- class選擇器：用于選擇具有特定class屬性的元素。

例如，我們可以使用選擇器來選擇下面這些元素：

<div id="myDiv">我的內容</div>

2. 樣式

CSS樣式用于定義元素的樣式，包括字體、顏色、大小、位置等。我們可以使用CSS屬性來設置樣式，這些屬性包括：

- font-family：用于設置字體 family 屬性，可以選擇多種字體。

- font-size：用于設置字體大小，可以設置單點、雙點、度量等單位。

- color：用于設置顏色，可以設置RGB、hex或其他顏色單位。

- background-color：用于設置背景顏色，可以設置RGB、hex或其他顏色單位。

- line-height：用于設置行高，可以設置單點、雙點、度量等單位。

例如，我們可以使用以下CSS樣式來設置文本的顏色為紅色：

body {

font-family: Arial, sans-serif;

color: red;

3. 布局

CSS布局用于決定網頁中元素如何排列和顯示，包括 float、position、對齊方式等。我們可以使用CSS布局規則來將元素放置在不同的位置，從而實現復雜的網頁布局。

例如，我們可以使用以下CSS規則來將一個包含表格的元素放在頁腳：

table {

border-collapse: collapse;

width: 100%;

th, td {

border: 1px solid #ccc;

padding: 8px;

background-color: #f2f2f2;

position: relative;

background-color: #ddd;

position: absolute;

bottom: 0;

在這個例子中，我們使用table選擇器來選擇具有特定th屬性的元素，并使用th和td選擇器來設置元素的背景顏色和邊框樣式。我們還使用position屬性來設置元素的位置，使其位于頁腳。