在CSS中，:before被稱為偽元素，它添加了一個元素到已選中的元素之前。它通常用于添加內容到元素的前面（如圖標或裝飾符號），而不需要修改HTML代碼。實現:before，需要使用CSS屬性content。例如：

p:before {
content: ">>";
}

上面的代碼將在每個

元素前添加兩個“>”符號。而且我們也可以使用:before來為元素添加顏色、背景、陰影等樣式。這里是一個例子：

p:before {
content: "";
display: inline-block;
margin-right: 5px;
width: 10px;
height: 10px;
border-radius: 50%;
background-color: #f00;
}

上面的代碼將在每個

元素前添加一個圓圈，背景顏色為紅色。接下來我們通過使用:hover偽類來實現光標懸停時樣式的改變。

p:hover:before {
transform: rotate(180deg);
}

上面的代碼將在鼠標懸停在

元素上時，使該元素前面的內容旋轉180度。這樣我們就可以用CSS中的:before偽類和:hover偽類來創建一些很酷的樣式了！