CSS3是一個功能強大的樣式語言，它可以為網(wǎng)頁添加豐富的樣式效果。其中，繞一邊旋轉(zhuǎn)是CSS3中一個非常有趣的效果，可以為網(wǎng)頁添加更多的交互性和趣味性。

/*定義一個div*/
div{
width: 200px;
height: 200px;
margin: 50px auto;
border-radius:50%;
background-color:#eee;
position:relative;
}
/*定義div子元素*/
div:before{
content: "";
width: 100px;
height: 100px;
background-color: #333;
position: absolute;
top: -10px;
left: -10px;
border-radius:50%;
transform:rotate(-45deg);
z-index: -1;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
/*定義hover狀態(tài)下的div子元素*/
div:hover:before{
transform:rotate(225deg);
}

上面的代碼中，我們首先定義一個div元素，并設(shè)置其寬度、高度、外邊距、圓角等屬性。然后，我們在div元素中添加一個:before偽元素，并設(shè)置其內(nèi)容為空，寬度、高度、背景顏色、位置、圓角、陰影等屬性。在transform屬性中，我們設(shè)置其rotate(-45deg)表示該元素繞Z軸逆時針旋轉(zhuǎn)45度。

接下來，我們在div:hover狀態(tài)下，再次定義:before偽元素，并在transform屬性中設(shè)置其rotate(225deg)表示該元素繞Z軸順時針旋轉(zhuǎn)225度，從而完成元素繞一邊旋轉(zhuǎn)的效果。

通過這種方法，我們可以方便地實現(xiàn)元素繞一邊旋轉(zhuǎn)的效果，為網(wǎng)頁添加更多的動感和趣味性。