在CSS中，循環元素是非常有用的技巧之一，可以幫助我們快速、有效地管理大量元素。下面讓我們看看如何使用css循環元素。

/* CSS 循環元素 */
/* 對 class 為 box 的元素來一些和 border 相關的樣式 */
@for $i from 1 through 3 {
.box:nth-child(#{$i}) {
border: #{$i}px solid red;
}
}

上面這段代碼使用了@for指令對 class 為 box 的元素進行循環，實現了加粗邊框的功能。在這個例子中，使用了$i變量來表示循環的次數， `#{$i}` 則是 Sass 的插值語法，用來將變量插入到字符串中。

除了@for循環之外，CSS 還提供了其他的循環指令：@while以及@each。下面是循環圖片背景的一個例子：

/* 使用 @each 循環，給每一個元素都設置不同的圖片背景 */
$images: image1.jpg, image2.jpg, image3.jpg;
@each $image in $images {
.box {
background-image: url($image);
}
}

上面的代碼使用了 @each 指令，將數組中每個圖片地址賦值給變量 $image。然后，對 class 為 box 的元素應用了不同的背景圖片，實現了多樣化的排版效果。

總之，CSS 循環元素是一項非常有用的技術，無論是在開發響應式網站還是大型應用程序中，都可以節省開發時間和工作量。