CSS陀螺儀是一種在網頁開發中使用的特殊效果，能夠使頁面元素產生360度的旋轉效果，類似于一個陀螺儀的旋轉效果。使用CSS陀螺儀能夠增加頁面動態效果，吸引用戶的注意力。

代碼演示：
.spinner {
position: relative;
height: 100px;
width: 100px;
}
.spinner:before {
content: "";
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
border-radius: 50%;
border: 5px solid #eee;
border-top-color: #3a3a3a;
animation: spin 2s linear infinite;
box-sizing: border-box;
}
@keyframes spin {
0% { transform: rotate(0); }
100% { transform: rotate(360deg); }
}

上例代碼中，首先定義了一個名為.spinner的CSS類，其中設定了元素的位置、高度和寬度等屬性，使得該元素能夠以固定的大小與位置呈現在網頁中。接下來，在該元素上增加了一個:before偽元素，該元素用來產生環形邊框。其中定義了該元素的圓角、邊框粗細、顏色等屬性，并設置了一個動畫效果：使該元素沿Y軸不斷旋轉，實現陀螺儀的效果。

在網頁開發中，我們可以根據需要調整陀螺儀的樣式，如修改環形邊框的粗細、調整顏色等。同時，我們也可以將陀螺儀效果應用到不同的元素中，實現不同的動態效果。