CSS 可以為圖表、圖形等元素設置樣式，使其更加美觀。以下是一些 CSS 設置圖表的示例：

/* 簡單條狀圖 */
.bar {
width: 50px;
height: 200px;
background-color: #f00;
margin-right: 10px;
display: inline-block;
}
/* 復雜線圖 */
.line {
width: 400px;
height: 200px;
border: 1px solid #ccc;
margin-bottom: 20px;
position: relative;
}
.plot {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.plot-point {
width: 7px;
height: 7px;
border-radius: 50%;
background-color: #4caf50;
position: absolute;
top: 50%;
left: calc(10% + 25px);
transform: translate(-50%, -50%);
}
/* 3D 餅圖 */
.pie {
width: 200px;
height: 200px;
position: relative;
border-radius: 50%;
overflow: hidden;
}
.pie-piece {
width: 100%;
height: 100%;
position: absolute;
clip: rect(0 100px 200px 0);
transform-origin: 50% 0%;
border-radius: 50%;
}
.pie-piece1 {
background-color: #f00;
transform: rotate(180deg);
}
.pie-piece2 {
background-color: #0f0;
transform: rotate(60deg);
}
.pie-piece3 {
background-color: #00f;
transform: rotate(120deg);
}
.pie-piece4 {
background-color: #ff0;
transform: rotate(300deg);
}

上述代碼中，`bar` 類為簡單條狀圖，通過 `width` 和 `height` 設置圖形的大小，`background-color` 設置圖形的顏色，`margin-right` 設置多個圖形的間距，`display` 設置為 `inline-block` 使其以塊級元素的顯示同時又能夠在一行顯示。

`line` 類為復雜線圖的樣式，用 `width` 和 `height` 設置圖形的大小，`border` 設置邊框的樣式，`margin-bottom` 設置多個圖形的間距，`position` 設置為相對定位，`plot` 類為線圖中的點，使用絕對定位，`plot-point` 類設置上述點的樣式。

`pie` 類為 3D 餅圖的樣式，使用 `width` 和 `height` 設置圖形的大小，`position` 設置為相對定位，`border-radius` 設置邊框的圓角，`overflow` 設置隱藏當 `pie-piece` 類的部分超出 `pie` 類的邊界時的顯示方式，`pie-piece` 類為餅圖的一塊，使用絕對定位和 `clip` 剪切形狀，`transform-origin` 為其變換起始點（中心），`border-radius` 設置邊框的圓角，`pie-piece1`、`pie-piece2`、`pie-piece3`、`pie-piece4` 分別為餅圖的四塊，使用 `transform` 旋轉的方式實現旋轉效果。