在網頁開發中，數據可視化圖表是一種非常常見的效果。它能夠生動形象地展示數據，幫助用戶更好地理解和分析數據。

CSS是一種網頁樣式語言，它不僅能夠修改網頁的排版和樣式，還能夠通過一些技巧生成簡單的圖表效果。

/* 生成柱狀圖 */
.bar-chart {
/* 容器寬度和高度 */
width: 300px;
height: 200px;
/* 柱狀圖具體樣式 */
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.bar {
/* 柱狀圖顏色 */
background-color: #5cb85c;
/* 柱狀圖寬度和高度 */
width: 30px;
height: 100px;
/* 柱狀圖間隔 */
margin-right: 20px;
}
/* 生成餅圖 */
.pie-chart {
/* 容器寬度和高度 */
width: 200px;
height: 200px;
/* 餅圖具體樣式 */
border-radius: 50%;
overflow: hidden;
position: relative;
}
/* 餅圖切片 */
.pie-slice {
position: absolute;
top: 50%;
left: 50%;
transform-origin: 0% 50%;
border-radius: 50%;
}
.slice-1 {
/* 切片顏色 */
background-color: #d9534f;
/* 切片角度 */
transform: rotate(45deg);
/* 切片大小 */
width: 50%;
height: 100%;
}
.slice-2 {
/* 切片顏色 */
background-color: #f0ad4e;
/* 切片角度 */
transform: rotate(135deg);
/* 切片大小 */
width: 50%;
height: 100%;
}

以上代碼生成了一組柱狀圖和一個餅圖。關于如何動態生成數據，可以通過JavaScript實現。比如，可以使用AJAX請求后臺接口獲取數據，然后動態生成對應的CSS。

綜上所述，CSS雖然不是專業的數據可視化工具，但是通過一些小技巧也能夠實現簡單的圖表效果。然而，對于更復雜的需求，還是需要專業的數據可視化工具來支持。