CSS代碼畫肖像畫

有時候，我們需要使用純CSS代碼來完成一些有創意的效果，如同使用繪畫工具一樣，我們可以使用CSS來畫出肖像畫。下面就是一個例子，使用CSS代碼畫出了一副莫妮卡·貝魯奇的肖像畫：

.portrait {
width: 300px;
height: 400px;
background-color: #FFF;
position: relative;
border-radius: 50%;
overflow: hidden;
margin: 0 auto;
}
.portrait::before {
content: "";
width: 250px;
height: 300px;
background-color: #2F2F2F;
border-top-right-radius: 60% 100%;
border-top-left-radius: 60% 100%;
position: absolute;
bottom: -10px;
left: 50%;
transform: translateX(-50%);
}
.portrait img {
width: 200px;
height: 300px;
display: block;
margin: 0 auto;
position: relative;
top: 25px;
z-index: 2;
}
.portrait::after {
content: "";
width: 60px;
height: 100px;
background-color: #FFF;
position: absolute;
bottom: -5px;
left: 50%;
transform: translateX(-50%);
border-radius: 0% 0% 40% 40%;
}

在這段CSS代碼中，我們使用了偽元素`:before`和`:after`來實現畫框和橢圓形脖子的效果。其中，`border-radius`屬性的運用非常巧妙，通過不同的數值定義出橢圓形的輪廓，實現了肖像的立體感。同時，我們也可以像素級地控制每個元素的位置和大小，用`transform`屬性實現旋轉等效果，完美地展現了一幅肖像畫的風格。

這只是一個簡單的例子，相信你已經掌握了如何使用純CSS代碼來畫出精美的肖像畫。讓我們發揮自己的創意，去創造更多美麗、令人驚嘆的藝術作品吧！