進入網頁的時候，你有沒有發現網頁上的一些可愛的動物圖標呢？這些圖標常常由CSS樣式來繪制，讓網頁更具生動感和趣味性。下面我們來了解一下如何使用CSS樣式來繪制動物圖標。

/*定義樣式*/
.icon {
width: 100px;
height: 100px;
display: inline-block;
background-repeat: no-repeat;
background-size: 100%;
}
/*貓的樣式*/
.cat {
background-image: url(cat.png);
}
/*狗的樣式*/
.dog {
background-image: url(dog.png);
}
/*熊貓的樣式*/
.panda {
background-image: url(panda.png);
}
/*兔子的樣式*/
.rabbit {
background-image: url(rabbit.png);
}
/*使用樣式*/

在這里，我們定義了一個樣式類名為 icon，這個樣式用于繪制動物圖標，并設置圖標寬高為 100px，背景重復不出現，背景大小為 100%。接下來，我們分別定義了貓、狗、熊貓和兔子的樣式，每個樣式都定義了背景圖片，這里假設我們已經有了相應的動物圖片。最后，在 HTML 中使用樣式類名為 icon 和動物類名 cat、dog、panda、rabbit 來實現動物圖標的繪制。

通過這種方式，我們可以輕松地實現各種動物圖標的繪制，并為網頁增加一些可愛趣味的元素。