CSS帶圓圈的數字是一種非常實用的樣式，它可以在數字周圍添加一個圓圈，使數字看起來更加美觀。

.circle {
display: inline-block;
width: 30px;
height: 30px;
border-radius: 50%;
text-align: center;
line-height: 30px;
font-size: 14px;
margin-right: 10px;
background-color: #ccc;
}
.num {
display: inline-block;
}

此處的CSS代碼使用了兩個類名：.circle和.num。.circle類定義了圓圈的樣式，包括寬度、高度、邊框半徑、文本居中等等。.num類則用于包裹數字文本，將數字與圓圈分開來。

<div class="circle">1</div><span class="num">This is the first number</span>
<br>
<div class="circle">2</div><span class="num">This is the second number</span>
<br>
<div class="circle">3</div><span class="num">This is the third number</span>
<br>

當HTML代碼應用CSS樣式后，數字字體將自動垂直居中在圓圈中間。使用此樣式可使您的數字列表更加美觀，易于理解。