CSS 文本陰影

文本陰影

text-shadow 屬性為文本添加陰影。

最簡單的用法是只指定水平陰影(2px)和垂直陰影(2px):

文字陰影效果!

實例

h1 {
  text-shadow: 2px 2px;
}

親自試一試

接下來,向陰影添加顏色(紅色):

文字陰影效果!

實例

h1 {
  text-shadow: 2px 2px red;
}

親自試一試

然后,向陰影添加模糊效果(5px):

文字陰影效果!

實例

h1 {
  text-shadow: 2px 2px 5px red;
}

親自試一試

提示:請訪問 CSS 字體 一章,學習如何更改字體、文本大小和文本樣式。

提示:請訪問 CSS 文本效果 一章,學習如何實現不同的文本效果。

所有 CSS 文本屬性

屬性 描述
color 設置文本顏色。
direction 指定文本的方向 / 書寫方向。
letter-spacing 設置字符間距。
line-height 設置行高。
text-align 指定文本的水平對齊方式。
text-decoration 指定添加到文本的裝飾效果。
text-indent 指定文本塊中首行的縮進。
text-shadow 指定添加到文本的陰影效果。
text-transform 控制文本的大小寫。
text-overflow 指定應如何向用戶示意未顯示的溢出內容。
unicode-bidi 與 direction 屬性一起使用,設置或返回是否應重寫文本來支持同一文檔中的多種語言。
vertical-align 指定文本的垂直對齊方式。
white-space 指定如何處理元素內的空白。
word-spacing 設置單詞間距。