位置:首頁 > 軟件操作教程 > 編程開發(fā) > CSS > 問題詳情

CSS3 文本陰影 text-shadow

提問人:劉團(tuán)圓發(fā)布時間:2020-11-19

    使用text-shadow屬性可以為文本設(shè)置陰影。在text-shadow還沒有出現(xiàn)時,如果在網(wǎng)頁設(shè)計中添加陰影,則需要用Photoshop制作圖片。有了CSS3,可以直接使用text-shadow屬性來指定陰影。這個屬性有兩個作用:產(chǎn)生陰影和模糊主體。這樣,在不使用圖片時,也能給文字增加質(zhì)感。

    使用text-shadow屬性可以為文本添加一個或多個陰影。該屬性是逗號分隔的陰影列表,每個陰影由兩或三個長度值和一個可選的顏色值進(jìn)行規(guī)定,省略的長度是0。

    text-shadow屬性有四個值,要按照順序排列:

    ?h-shadow:必需,水平陰影的位置,允許負(fù)值。

    ?v-shadow:必需,垂直陰影的位置,允許負(fù)值。

    ?blur:可選,模糊的距離。

    ?color:可選,陰影的顏色。

    下面通過一個實(shí)例來了解text-shadow屬性。

    【例題】使用text-shadow屬性

    代碼如下:

<!DOCTYPE html>

<html>

<head>

<style> 

p{

text-shadow: 5px 10px 10px red;

}

</style>

</head>

<body>

<p>我是測試文字陰影的文本</p>

</body>

</html>

image.png

繼續(xù)查找其他問題的答案?

相關(guān)視頻回答
回復(fù)(0)
返回頂部