CSS3中可以通過使用border-radius屬性和旋轉來生成環形線條，非常簡單易用。

.circle {
width: 100px;
height: 100px;
border: 10px solid #ccc;
border-radius: 50%;
border-top-color: #f00;
animation: rotate 2s linear infinite;
}
@keyframes rotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}

上述代碼生成了一個寬高為100px的環形線條，顏色為灰色，邊框寬度為10px，半徑為50%。通過設置border-top-color屬性，可以指定環形線條的顏色，這里為紅色。同時，通過animation屬性，實現了一個持續旋轉效果。

除了使用border-radius和旋轉之外，還可以使用CSS3的transform屬性實現環形線條，非常靈活。以下是一段使用transform實現的環形線條代碼：

.circle {
width: 100px;
height: 100px;
border: 10px solid #ccc;
border-radius: 50%;
position: relative;
}
.circle::before {
content: "";
position: absolute;
top: -10px;
left: -10px;
width: 120px;
height: 120px;
border: 10px solid #f00;
border-radius: 50%;
transform-origin: center center;
animation: rotate 2s linear infinite;
}
@keyframes rotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}

上述代碼使用了一個偽元素來實現環形線條，偽元素的樣式中，通過設置width和height，使它比.circle元素大出20px，然后通過top和left把它定位到了.circle元素的外面。然后通過border-radius和transform-origin屬性分別設置偽元素的半徑和旋轉的中心點，最后通過animation實現持續旋轉效果。