CSS3:TEXT-SHADOW|BOX-SHADOW（炫彩字體）

elisa.yang 發布于2019-08-30 14:12 / 2747人閱讀

摘要：可為負值第個長度值陰影垂直偏移值。不允許負值設置陰影的顏色。字體微軟雅黑

2016年2月26日個人博客文章--遷移到segmentfault

（1）text-shadow(文本陰影)

在介紹css3:text-shadow文本陰影之前，我們先來看看用它都能實現什么效果：

沒錯文本的陰影的效果很強大，接下來我們就一起開始學習吧.

語法：text-shadow：none | length{2,3} color

默認值：none

取值：

none:無陰影

第1個長度值：陰影水平偏移值。可為負值

第2個長度值：陰影垂直偏移值。可為負值

第3個長度值：可選，陰影模糊值。不允許負值

color：設置陰影的顏色

說明:可以設定多組效果，每組參數值以逗號分隔

text-shadow:水平偏移量垂直偏移量陰影模糊值顏色（rgba）,

        水平偏移量  垂直偏移量 陰影模糊值  顏色（rgba）,
        水平偏移量  垂直偏移量 陰影模糊值  顏色（rgba）

注意：(1)使用空格分開不同屬性值 (2)使用逗號分開不同陰影屬性

字體

Beautiful Text

在瀏覽器上展示效果如圖所示：

（2）box-shadow（盒陰影）

因為box-shadow與text-shadow用法幾乎相同只是box-shadow與文本陰影相比，盒陰影多了一個屬性值——陰影外延值（第四個值）

語法：box-shadow：none | length{2,4} color默認值：none

取值：

none：無陰影

第1個長度值：陰影水平偏移值。可為負值

第2個長度值：陰影垂直偏移值。可為負值

第3個長度值：可選，陰影模糊值。不允許負值

第4個長度值：可選，陰影外延值。不允許負值

color：設置陰影的顏色。

字體

Beautiful Text

GPU云服務器云服務器 box-shadow 炫彩網絡炫彩網絡炫彩炫彩網絡

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/115849.html

CSS3:TEXT-SHADOW|BOX-SHADOW（炫彩字體）

摘要：可為負值第個長度值陰影垂直偏移值。不允許負值設置陰影的顏色。字體微軟雅黑 2016年2月26日個人博客文章--遷移到segmentfault （1）text-shadow(文本陰影) 在介紹css3:text-shadow文本陰影之前，我們先來看看用它都能實現什么效果： showImg(https://segmentfault.com/img/bV6z1P?w=300&h=136); ...

wangzy2019 2019-08-01 18:43 評論0 收藏0
鼠標跟隨炫彩效果

摘要：以前在網上看到了別人這個效果，感覺很酷也很難，但當真的去了解怎么做的時候會發現其實沒那么難。先來看一下效果可能不是很好看啊。以前在網上看到了別人這個效果，感覺很酷也很難，但當真的去了解怎么做的時候會發現其實沒那么難。用到的就是canvas。先來看一下效果 showImg(https://segmentfault.com/img/remote/1460000017871525?w=3...

yiliang 2019-08-23 14:40 評論0 收藏0
css學習day05

摘要：規則取值關鍵字位置取消顏色十六進制簡寫為函數關鍵字漸變色長度絕對單位相對單位當前元素上的字體大小當前元素中設定的字體大小百分比字體樣式可以被繼承族微軟雅黑宋體字體棧微軟雅黑大小網頁默認字體為粗細是否打開斜體速寫，簡寫規則取值：關鍵字：位置 left right center top bottom medium 取消 ...

EdwardUp 2019-08-30 15:44 評論0 收藏0