CSS樣式可以根據元素的狀態進行設置,例如根據鼠標的交互狀態或者元素的狀態(如checked或者hover等)。下面是一些使用CSS樣式根據狀態進行設置的實例。
/* 當鼠標懸停在按鈕上時,改變按鈕的樣式 */ button:hover { background-color: gray; color: white; } /* 當一個鏈接被點擊時,在鏈接文字下添加一個下劃線 */ a:active { text-decoration: underline; } /* 當一個單選框被選中時,改變它的顏色 */ input[type="radio"]:checked { border: 2px solid red; } /* 當一個復選框被選中時,改變它的顏色 */ input[type="checkbox"]:checked { background-color: yellow; }
在這些示例中,CSS選擇器基于元素的狀態進行設置。您可以根據需要創建自己的樣式,并根據不同的狀態進行設置。這些狀態包括懸停(hover)、點擊(active)、選中(checked)和未選中(unchecked)等等。