CSS表現(xiàn)進度條是網(wǎng)頁設計中常用的一種交互效果，它可以用來表示某個任務或請求的完成度。下面演示一種基于CSS實現(xiàn)的進度條效果：

.progress-bar {
width: 300px;
height: 20px;
background-color: #f2f2f2;
border-radius: 10px;
}
.progress {
width: 60%;
height: 100%;
background-color: #4CAF50;
border-radius: 10px;
}

上面的代碼定義了一個進度條容器`.progress-bar`和進度條本身`.progress`。容器的寬度和高度可以根據(jù)實際需求進行調整，同時設置了一個灰色的背景和圓角邊框效果。進度條的寬度的設定就決定了它的完成度，本例中進度條的寬度為60%。

用法如下：

<div class="progress-bar">
<div class="progress"></div>
</div>

以上代碼就可以在頁面中顯示出一個簡單的進度條效果，具有較好的可讀性和可維護性。