CSS圓餅圖可以為網(wǎng)頁添加更多的視覺效果，同時文字也可以很好地融入其中。下面是一個使用CSS圓餅圖和文字的示例：

<div class="pie-chart"><div class="slice"><div class="text">25%</div><div class="fill fill-25"></div></div><div class="slice"><div class="text">35%</div><div class="fill fill-35"></div></div><div class="slice"><div class="text">40%</div><div class="fill fill-40"></div></div></div>

代碼中，我們使用一個包含三個片段的div容器創(chuàng)建我們的圓餅圖。每個片段都包括一個文字div和一個填充div。文字用于顯示當前片段所占的百分比，填充則用于顯示當前片段的顏色。

.pie-chart {
position: relative;
width: 200px;
height: 200px;
border-radius: 50%;
}
.slice {
position: absolute;
width: 100%;
height: 100%;
clip: rect(0, 100px, 200px, 0);
}
.fill {
position: absolute;
width: 100%;
height: 100%;
border-radius: 50%;
}
.fill-25 {
background-color: #EE6352;
transform: rotate(90deg);
clip: rect(0, 100px, 200px, 0);
}
.fill-35 {
background-color: #59CD90;
transform: rotate(180deg);
clip: rect(0, 200px, 200px, 100px);
}
.fill-40 {
background-color: #3FA7D6;
transform: rotate(270deg);
clip: rect(0, 200px, 200px, 100px);
}
.text {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #FFFFFF;
font-size: 2em;
}

這里的CSS代碼負責布局和樣式。我們首先為圓餅圖容器設置了一個寬度和高度，并將其邊緣設置成50%的圓角。然后，我們使用position: absolute將每個片段定位在容器中央，并使用clip屬性定義每個片段的大小和位置。最后，我們使用transform屬性將填充旋轉(zhuǎn)到正確的位置，并使用position: absolute和transform: translate將文字放置在填充后面的片段中央。

以上是CSS圓餅圖和文字的示例。你可以使用本文中的代碼和樣式來創(chuàng)建自己的圓餅圖，并根據(jù)需要進行修改。