CSS3是一種非常強大的網頁樣式設計語言，其中特別出色的一項功能是百分比圓環（Circular Progress Bar）。這是一種在網頁中實現圓環帶圖形和文字的方法，可以用于展示進度、比例等信息。下面是一個簡單的例子：

<div class="progress-bar"><div class="progress" style="width: 70%;"><p>70%</p></div><p>Progress</p></div>

其中，進度條的容器使用了一個名為.progress-bar的DIV，進度條DIV的類名為progress，里面放置了一個P標簽，用于展示進度的文字。為了實現圓環的形狀，我們需要使用CSS3的border-radius屬性。同時，我們使用了CSS3中的過渡效果，使進度動態展示：

.progress-bar {
position: relative;
display: inline-block;
width: 100px;
height: 100px;
margin: 50px;
}
.progress {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
clip: rect(0, 50px, 100px, 0);
background-color: #e6e6e6;
transition: clip 1s cubic-bezier(0.785, 0.135, 0.15, 0.86);
}
.progress p {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 24px;
font-weight: bold;
color: #333;
}
.progress-bar:hover .progress {
clip: rect(0, 100px, 100px, 50px);
}

通過以上CSS代碼，我們定義了進度條的樣式，包括其尺寸、位置和形狀等等。我們使用了CSS3的clip屬性，來剪裁進度條。當鼠標滑過進度條時，我們設置過渡效果，讓進度條動態展示。

這是一個簡單的基于CSS3的百分比圓環畫，完全不需要用到任何Javascript代碼。它可以輕松地添加到任何網頁中，讓網頁更具有動感和互動性。