眾所周知，《貓和老鼠》是一部家喻戶曉的卡通動畫片。其中的主人公——聰明機智的老鼠杰瑞，深受觀眾喜愛。在這篇文章中，我將會教大家如何使用 CSS 畫出杰瑞。

.jerry {
/*設置畫布大小和背景顏色*/
width: 200px;
height: 200px;
background-color: #FFFACD;
border-radius: 50%;
 }
/*頭部*/
 .jerry .head {
width: 80px;
height: 80px;
background-color: #FFF8DC;
border-radius: 50%;
position: absolute;
left: 60px;
top: 60px;
 }
/*耳朵*/
 .jerry .ear {
width: 25%;
height: 25%;
border-radius: 50%;
background-color: #FFF8DC;
position: absolute;
top: 5px;
 }
 .jerry .ear.left {
left: 15%;
 }
 .jerry .ear.right {
right: 15%;
 }
/*眼睛*/
 .jerry .eye {
width: 15%;
height: 15%;
background-color: #F1C40F;
border-radius: 50%;
position: absolute;
top: 40%;
 }
 .jerry .eye.left {
left: 25%;
 }
 .jerry .eye.right {
right: 25%;
 }
/*瞳孔*/
 .jerry .pupil {
width: 50%;
height: 50%;
background-color: black;
border-radius: 50%;
position: absolute;
top: 25%;
 }
 .jerry .pupil.left {
left: 25%;
 }
 .jerry .pupil.right {
right: 25%;
 }
/*鼻子*/
 .jerry .nose {
width: 10px;
height: 10px;
background-color: black;
border-radius: 50%;
position: absolute;
top: 55%;
left: 50%;
margin-left: -5px;
 }
/*嘴巴*/
 .jerry .mouth {
width: 45%;
height: 25%;
border-bottom-left-radius: 50%;
border-bottom-right-radius: 50%;
border-top-left-radius: 0;
border-top-right-radius: 0;
border-top: 10px solid #F1C40F;
position: absolute;
top: 65%;
left: 27.5%;
 }

通過上面的代碼，我們成功的畫出了一個可愛的杰瑞。當然，隨著對 CSS 更深入的了解，可以對細節進行完善，使畫出來的杰瑞更加逼真，更加可愛。希望大家能夠從中受益，發揮自己的想象力，創造出更多有趣的東西。