CSS可以用來畫圖片，這就需要用到一些基本的畫圖技巧和CSS屬性。

/*首先定義一個div*/
div{
border: 5px solid black; /*設(shè)置邊框顏色和寬度*/
width: 100px; /*設(shè)置寬度*/
height: 100px; /*設(shè)置高度*/
background-color: yellow; /*設(shè)置背景顏色*/
border-radius: 50%; /*設(shè)置圓角*/
}
/*給div加上一個偽元素*/
div::after{
content: ""; /*content必須設(shè)置為空字符串*/
position: absolute; /*設(shè)置絕對定位*/
top: 50%; /*設(shè)置距離上邊界的距離*/
left: 50%; /*設(shè)置距離左邊界的距離*/
width: 50px; /*設(shè)置寬度*/
height: 50px; /*設(shè)置高度*/
background-color: black; /*設(shè)置背景顏色*/
border-radius: 50%; /*設(shè)置圓角*/
transform: translate(-50%, -50%); /*設(shè)置偏移量*/
}

以上代碼實現(xiàn)的效果是一個黃色的圓，中間有一個黑色的圓。

如果想讓黃色的圓變成紅色，可以將background-color的屬性值改為red。

如果想讓黑色的圓變成橙色，可以將background-color的屬性值改為orange。

/*修改黃色圓的顏色*/
div{
background-color: red;
}
/*修改黑色圓的顏色*/
div::after{
background-color: orange;
}

如果想要實現(xiàn)更復(fù)雜的圖形，可能需要用到更多的CSS屬性。在使用CSS繪制圖形時，需要靈活運用各種屬性，才能實現(xiàn)想要的效果。