使用 CSS 建立衰減陰影

陰影濾鏡用於按指定的方向和顏色建立一個衰減陰影。

該濾鏡中可以使用以下引數 −

序號	引數和說明
1	顏色您希望陰影的顏色。
2	方向模糊的方向，順時針旋轉，以 45 度為增量進行舍入。預設值為 270（左）。 0 = 頂部 45 = 右上角 90 = 右側 135 = 右下角 180 = 底部 225 = 左下角 270 = 左側 315 = 左上角

例子

您可以嘗試執行以下程式碼來實現陰影濾鏡 −

現場演示

<html>
   <head>
   </head>

   <body>

      <img src="/css/images/logo.png" alt="CSS Logo"style="FILTER: Chroma(Color = #000000) Shadow(Color=#00FF00, Direction=225)">

      <p>Text Example:</p>

      <div style="width: 357;
         height: 50;
         font-size: 30pt;
         font-family:
         Arial Black;
         color: red;
         Filter: Shadow(Color=#0000FF, Direction=225)">CSS Tutorials</div>
   </body>

</html>

Ankith Reddy

更新於：2020 年 3 月 16 日

113 次瀏覽

開啟您的職業生涯

完成課程即可獲得認證

開始

使用 CSS 建立衰減陰影

例子

開啟您的 職業生涯

開啟您的職業生涯