如何為文字新增陰影
在本指南中，您將學習如何為頁面上的任何文字新增陰影。
為文字新增陰影
我們關於為框新增陰影的指南解釋瞭如何為頁面上的任何元素新增陰影。但是，該技術僅為元素的周圍框新增陰影。要為文字本身新增投影，您需要一個不同的 CSS 屬性：text-shadow。
text-shadow 屬性接受多個值
- X 軸偏移量
- Y 軸偏移量
- 模糊半徑
- 顏色
在下面的示例中，我們將 X 軸偏移量設定為 2px，Y 軸偏移量設定為 4px，模糊半徑設定為 4px，顏色設定為半透明藍色。嘗試不同的值，看看它們如何改變陰影效果。
html
<div class="wrapper">
<h1>Adding a shadow to text</h1>
</div>
css
h1 {
color: royalblue;
text-shadow: 2px 4px 4px rgb(46 91 173 / 0.6);
}
注意： 新增文字陰影時，您可能會無意中使文字難以閱讀。確保您的選擇提供了足夠的顏色對比度，以保持文字可讀。