前端開發中，CSS不僅僅用來實現頁面的布局排版，還可以用于繪制各種圖形。通過CSS畫圖，能夠使得頁面視覺效果更加豐富，提高頁面的美觀程度。下面介紹一些CSS畫圖的方法。

/* 畫圓 */
.circle {
width: 100px;
height: 100px;
border-radius: 50%;
background-color: red;
}
/* 畫直線 */
.line {
width: 100px;
height: 1px;
background-color: black;
}
/* 畫三角形 */
.triangle {
width: 0;
height: 0;
border-style: solid;
border-width: 50px 0 0 50px;
border-color: transparent transparent transparent red;
}
/* 畫正方形 */
.square {
width: 100px;
height: 100px;
background-color: blue;
}
/* 畫矩形 */
.rectangle {
width: 200px;
height: 100px;
background-color: yellow;
}
/* 畫梯形 */
.trapezoid {
height: 0;
width: 100px;
border-top: 50px solid red;
border-right: 25px solid transparent;
border-left: 25px solid transparent;
}
/* 畫五角星 */
.star {
position: relative;
width: 0;
height: 0;
border-right: 100px solid transparent;
border-bottom: 70px solid black;
border-left: 100px solid transparent;
transform: rotate(35deg);
}
.star:after {
content: "";
position: absolute;
top: 25px;
left: -65px;
width: 0;
height: 0;
border-right: 60px solid transparent;
border-bottom: 40px solid black;
border-left: 60px solid transparent;
transform: rotate(-35deg);
}

以上代碼演示了基本的CSS畫圖方法，可以根據需要自行調整參數來實現不同的圖形。