CSS3引入了很多新的特性，其中之一就是圖片投影。圖片投影通過給圖片增加陰影效果，讓圖片更加生動有趣。下面我們來具體了解一下如何通過CSS3來實現圖片投影效果。

/* 基本語法 */
box-shadow: h-shadow v-shadow blur spread color inset;
/* 實現投影 */
img {
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}
/* 解釋 */
- h-shadow：水平陰影的位置，可正負值。
- v-shadow：垂直陰影的位置，可正負值。
- blur：模糊距離，可正負值。
- spread：投影的大小，可正負值。
- color：陰影的顏色。
- inset：可選，表示陰影為內投影。
/* 演示不同形態的投影效果 */
img {
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); /* 默認陰影 */
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5); /* 更大的陰影 */
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); /* 陰影向四周擴散 */
box-shadow: 2px 2px 5px rgba(255, 0, 0, 0.5); /* 紅色陰影 */
box-shadow: inset 2px 2px 5px rgba(0, 0, 0, 0.5); /* 內投影 */
}

通過設置適當的陰影顏色、大小和形狀，我們可以實現不同的陰影效果，從而讓圖片更加立體、生動。需要注意的是，在使用圖片投影時，我們應該盡量避免使用太花哨的效果，讓陰影不要過于突出，這樣才能讓頁面更加美觀、舒適。