CSS3文字陰影 盒子陰影

2021-10-03 15:55:03 字數 786 閱讀 8320

1、文字陰影text-shadow

text-shadow:值1 值2 值3 值4;

text-shadow:10px 10px 4px pink;

值1:水平方向位置,向右為正值;必須有,可以為負值;

值2:垂直方向位置,向下為正值,必須有,可以為負值;

值3:陰影的模糊程度,不支援負值;

值4:顏色設定;

文字陰影可以設定多陰影,需要用逗號隔開,值1與值2位置不可以互換。

2、盒子陰影box-shadow

box-shadow:

x-shadow:水平方向陰影位置,必須有,支援負值

y-shadow:垂直方向陰影位置,必須有,支援負值

blur:模糊距離

spread:陰影的大小

color:陰影的顏色

inset:從外層的陰影(開始時)改變陰影內側陰影

盒子陰影可以設定多陰影,需要用逗號隔開。

inset:從外層的陰影(開始時)改變陰影內側陰影

CSS3文字陰影和盒子陰影及其案例

文字陰影是css3其中的乙個屬性,它的書寫格式是text shadow 每個屬性必然有對應的屬性值。text shadow的屬性值有 x y blur color x是延x軸移動的距離,y是延y軸移動的距離,blur是陰影的模糊值。要注意一點的是在文字陰影沒有設定顏色的情況下,預設與文字的顏色一致。...

CSS3文字陰影 盒子陰影屬性用法介紹

基礎語法 text shadow h shadow 必需 v shadow 必需 blur 可選 color 可選 h shadow 水平陰影位置,x軸右側為正數,左側為負數 允許為負數 v shodwo 垂直陰影位置,y軸下方為正,y軸上方為負數 允許為負數 blur 定義了陰影模糊距離 colo...

css3 文字陰影

text shadow 基本語法 textshadow none length none shadow shadow textshadow none color color length 表示由浮點數字和單位識別符號組成的長度值,可為負值,指定陰影的水平延伸距離 color 表示顏色。陰影位於左上角...