CSS消息提示圖標是網站或者應用程序中必備的組件。他們可以幫助用戶更好地理解網站或者應用程序中發生的事情，并提供有用的反饋信息。在這篇文章中，我們將介紹一些常用的CSS消息提示圖標，以及如何在網站或者應用程序中添加這些圖標。

/* CSS消息提示圖標 */
.warning {
background-color: #fcf8e3;
color: #8a6d3b;
border: 1px solid #faebcc;
padding: 15px;
border-radius: 4px;
display: inline-block;
}
.info {
background-color: #d9edf7;
color: #31708f;
border: 1px solid #bce8f1;
padding: 15px;
border-radius: 4px;
display: inline-block;
}
.error {
background-color: #f2dede;
color: #a94442;
border: 1px solid #ebccd1;
padding: 15px;
border-radius: 4px;
display: inline-block;
}

如上所示的CSS代碼包含了三種常用的消息提示圖標：警告、信息、和錯誤。警告的背景顏色為黃色，信息的背景顏色為淺藍色，錯誤的背景顏色為淺紅色。每個圖標都有自己的顏色和樣式，但是它們都具有一個類名，以便在應用程序中使用。

要將這些圖標應用到網站或者應用程序中，只需在HTML代碼中添加相應的HTML標記，并將圖標的類名應用到標記中。例如：

<div class="warning">
<p>這是一個警告信息。</p>
</div>
<div class="info">
<p>這是一個信息。</p>
</div>
<div class="error">
<p>這是一個錯誤。</p>
</div>

如上所示的HTML代碼將在網站或者應用程序中創建三個不同的消息提示圖標，分別為警告、信息和錯誤。每個圖標都包含一個段落元素，用于顯示消息文本。添加這些標記后，您可以將樣式應用到每個標記，并定制它們的外觀和感覺。

總之，CSS消息提示圖標是網站和應用程序中非常有用的組件。它們可以提供有用的反饋信息，并幫助用戶更好地理解發生的情況。通過在應用程序中添加這些圖標，您可以提高用戶的使用體驗，并使您的應用程序更加易于使用。