CSS3 開關樣式是一種通過 CSS 控制頁面上開關的樣式，可以讓頁面上的各種開關，如音量調節、亮度調節、開關機等，更加清晰易用。

使用 CSS3 開關樣式，可以通過設置開關的開關狀態(開啟/關閉)和開關位置，來控制開關的效果。以下是一個簡單的示例：

HTML 代碼：

```html

<input type="button" value="打開" id="open-button">

<input type="button" value="關閉" id="close-button">

CSS 代碼：

```css

#open-button, #close-button {

display: block;

width: 100%;

padding: 10px 20px;

font-size: 24px;

font-weight: bold;

border: none;

border-radius: 5px;

cursor: pointer;

#open-button:hover, #close-button:hover {

background-color: #e8e8e8;

#open-button:active, #close-button:active {

background-color: #4CAF50;

#close-button {

display: none;

#close-button:hover, #close-button:active {

background-color: #d9d9d9;

在上述示例中，我們創建了兩個按鈕，一個用于打開開關，另一個用于關閉開關。在 CSS 中，我們使用了 `display: block` 來將按鈕設置為可見，`width: 100%;` 和 `padding: 10px 20px` 來使其寬度和高度相等，并使其占據頁面的一定空間。我們還使用 `font-size: 24px;` 和 `font-weight: bold;` 來使按鈕更加顯著。

在按鈕的 `:hover` 和 `:active` 偽類中，我們使用了 `background-color` 屬性來設置按鈕的hover狀態和active狀態的背景顏色。在hover狀態中，按鈕的背景顏色將更改為 #e8e8e8，而在active狀態中，按鈕的背景顏色將更改為 #4CAF50。

最后，我們使用 `id` 屬性為按鈕設置一個唯一的標識符，以便在頁面中引用。

通過使用 CSS3 開關樣式，我們可以輕松地控制各種開關的效果，讓頁面更加易用和美觀。