要使用CSS制作环形进度条，需要用到以下关键词：border-radius、transform、animation、@keyframes等。
首先，使用border-radius属性将一个div元素变成圆形。接着，使用transform属性将其旋转90度，使其变成环状。然后，使用animation和@keyframes属性来创建动画，实现环形进度条的效果。
下面是一个示例代码：
HTML部分：
<div class="progress-ring">
<div class="progress-bar"></div>
</div>CSS部分：
.progress-ring {
width: 100px;
height: 100px;
background-color: #e6e6e6;
border-radius: 50%;
position: relative;
}
.progress-bar {
width: 50%;
height: 100%;
background-color: #ff8c00;
border-radius: 50%;
position: absolute;
top: 0;
left: 0;
transform-origin: center;
animation: progress 2s linear forwards;
}
@keyframes progress {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}这段代码会创建一个半径为50px的环形进度条，进度条的颜色为橙色。进度条的动画会在2秒内从0度旋转到360度，达到100%的进度。
需要注意的是，这段代码中的关键词border-radius、transform、animation、@keyframes等都是制作环形进度条所必需的关键词，需要仔细熟悉和理解。