text-shadow為css文字陰影、css字體投影與字體陰影含胡效用效果的CSS屬性單詞

css text-shadow陰影功效

一、text-shadow先容

text-shadow是CSS格局屬性單詞，是配置對(duì)象中文本的翰墨字體能否有陰影及含糊成果的CSS名堂。

1、text-shadow的值

通長(zhǎng)時(shí)間置4個(gè)值，每個(gè)值空格離隔，值離別：一個(gè)暗影色調(diào)、暗影字體左上角起靠左隔絕距離、暗影字體左上角起靠上間隔、暗影高度寬度大小(模糊水平)。

text-shadow解析闡發(fā)圖

text-shadow:#000 3px 4px 5px

告白：

設(shè)置裝備擺設(shè)對(duì)象內(nèi)筆墨陰影色采為彩色，陰影靠字體左上角起靠左3px，暗影靠字體左上角起靠上4px，陰影大小(寬、高)含糊程度為5px。

2、暗影大小與含胡

text-shadow有三個(gè)數(shù)值，前兩個(gè)配置暗影位置，末了一個(gè)數(shù)值設(shè)置暗影大小模糊水準(zhǔn)。而值越大陰影變大自然也越模糊，值小天然暗影規(guī)模小就清楚。

暗影大小與含混關(guān)系

從上圖看出暗影值越大陰影越含混。

3、兼容

IE8及以上閱讀器兼容，支流閱讀器兼容好比谷歌chrome、蘋果

二、容易用法

1、css代碼

div{text-shadow:#F00 3px 4px 5px}

p{text-shadow:#000 1px 1px 2px}

2、告白

div{text-shadow:#F00 3px 4px 5px}

配置DIV內(nèi)翰墨暗影血色，暗影分袂隔絕距離左和上為3px和4px，陰影大小模糊范疇為5px

p{text-shadow:#000 1px 1px 2px}

配置p內(nèi)筆墨暗影玄色，暗影別離隔斷左與上為1px，暗影領(lǐng)域大小2px

3、截圖

css字體陰影實(shí)例成就

三、css陰影精簡(jiǎn)實(shí)例

在一段文字中，指定幾個(gè)文字運(yùn)用text-shadow配置陰影成果。

1、代碼

文字暗影實(shí)例 CSS5

.ebox{ font-size:16px;bac千克round:#000; text-align:center;

color:#666; width:300px; height:100px; line-height:40px}

.yying{text-shadow:#FFF 1px 1px 1px; color:#000}

進(jìn)修CSS，上CSS5網(wǎng)！

總結(jié)

以上是生活随笔為你收集整理的html给文字添加阴影效果,text-shadow css文字阴影_字体投影属性样式的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。