CSS3選擇器有多種類型，它們可以根據不同的元素屬性、結構關系或狀態來選擇元素。下面將介紹幾種常用的CSS3選擇器類型，并提供具體的代碼示例。

元素選擇器：使用元素名稱作為選擇器，此處以p元素為例：

p {
  color: red;
}

類選擇器：使用類名作為選擇器，以.開頭，此處以class為example的元素為例：

.example {
  font-size: 16px;
}

ID選擇器：使用ID作為選擇器，以#開頭，此處以id為title的元素為例：

#title {
  font-weight: bold;
}

屬性選擇器：

[attr]：選擇具有指定屬性的元素，此處以具有data屬性的元素為例：

[data] {
  background-color: yellow;
}

[attr=value]：選擇具有指定屬性和值的元素，此處以data屬性值為example的元素為例：

[data="example"] {
  color: blue;
}

[attr^=value]：選擇具有以指定值開頭的屬性值的元素，此處以data屬性值以”test”開頭的元素為例：

[data^="test"] {
  text-decoration: underline;
}

結構性選擇器：

:nth-child(n)：選擇父元素的第n個子元素，此處以父元素的第3個子元素為例：

.parent :nth-child(3) {
  background-color: green;
}

:first-child：選擇父元素的第一個子元素，此處以父元素的第一個子元素為例：

.parent :first-child {
  font-style: italic;
}

偽類選擇器：

:hover：選擇鼠標懸停在元素上的狀態，此處以元素懸停時改變背景顏色為例：

.example:hover {
  background-color: orange;
}

:active：選擇元素被激活時的狀態，此處以元素被點擊時改變文字顏色為例：

.example:active {
  color: purple;
}