CSS圖標已經成為了網頁設計中必不可少的元素之一，它們可以為我們的頁面增添美感，也可以增強頁面的功能性。下面將介紹一些好看的CSS圖標。

.icon-heart {
display: inline-block;
width: 16px;
height: 16px;
background-image: url('heart.svg');
}
.icon-star {
display: inline-block;
width: 16px;
height: 16px;
background-image: url('star.svg');
}
.icon-comment {
display: inline-block;
width: 16px;
height: 16px;
background-image: url('comment.svg');
}

以上代碼是三個不同的CSS圖標，分別是愛心、星星和評論的圖標。使用時只需把class設置為對應的圖標名，即可在頁面中添加對應的CSS圖標。

當然，這些圖標只是個開始，你還可以使用CSS來修改它們的顏色、大小，甚至添加動畫效果。下面是一個例子：

.icon-rocket {
display: inline-block;
width: 24px;
height: 24px;
background-image: url('rocket.svg');
background-color: #f00;
background-size: contain;
background-position: center;
border-radius: 50%;
transition: transform 0.3s ease;
}
.icon-rocket:hover {
transform: rotate(360deg);
}

這個例子是一個火箭圖標，它的背景顏色為紅色，大小為24px，當鼠標懸停在上面時，它會順時針旋轉360度。這個效果展示了CSS的強大之處，讓圖標變得更加生動。