CSS選擇器是 CSS 樣式表的一種語法，用于選擇 HTML 元素中的特定屬性。它們在瀏覽器中渲染時會根據元素的樣式表屬性而有所不同。以下是一些常見的 CSS 選擇器和它們的作用。

1. `id` 選擇器

`id` 選擇器用于選擇具有指定 ID 元素的頁面元素。例如，以下代碼將選擇 ID 為“my-element”的元素：

div[id="my-element"] {

color: red;

font-size: 16px;

2. `class` 選擇器

`class` 選擇器用于選擇具有指定 CSS 類名(即選擇器中的“class”部分)的頁面元素。例如，以下代碼將選擇 ID 為“my-element”且類名為“color”的元素：

div.color[id="my-element"] {

color: blue;

font-size: 16px;

3. `style` 屬性

`style` 屬性用于給頁面元素添加樣式。它可以包含一個或多個 CSS 選擇器和樣式規則，例如：

div {

width: 300px;

height: 200px;

background-color: blue;

font-size: 16px;

div.red {

color: red;

div.green {

color: green;

4. `!important` 聲明

`!important` 聲明是一種強制聲明，它會覆蓋所有其他選擇器。雖然這種方法可以提高選擇器的準確性，但通常不建議使用。例如：

div.red {

color: red !important;

5. `類名` 選擇器

`類名` 選擇器用于選擇具有指定 CSS 類名的頁面元素。例如，以下代碼將選擇 ID 為“my-element”且類名為“color”的元素：

div.color.my-element {

color: blue;

font-size: 16px;

6. `*` 選擇器

`*` 選擇器用于選擇所有元素。例如，以下代碼將選擇所有元素：

color: red;

font-size: 16px;

7. `+` 選擇器

`+` 選擇器用于選擇第一個匹配的子元素。例如，以下代碼將選擇 ID 為“my-element”的第一個子元素：

div[id="my-element"] + div {

color: blue;

font-size: 16px;

以上是一些常見的 CSS 選擇器和它們的作用。在實際面試中，面試官可能會問有關這些選擇器的問題，因此了解它們的原理和用法是非常重要的。