使用 CSS 设置阴影效果

百变鹏仔 4个月前 (09-20) #CSS

文章标签阴影

Drop Shadow 用于在指定的 X（水平）和 Y（垂直）偏移量和颜色处创建对象的阴影。

此过滤器中可以使用以下参数：

参数	描述
颜色立即学习“前端免费学习笔记（深入）”；	颜色，采用 #RRGGBB 格式，阴影。
offX	投影沿 x 轴从视觉对象偏移的像素数。正整数将投影向右移动，负整数将投影向左移动。
offY	阴影沿 y 轴偏离视觉对象的像素数。正整数使阴影向下移动，负整数使阴影向上移动。
正	如果为 true，则对象的所有不透明像素都有阴影。如果为 false，则所有透明像素都有阴影。默认为 true。

示例

您可以尝试运行以下代码来设置 drop阴影效果：

现场演示

<html>   <head></head>   <body>      <img src = "/css/images/logo.png"         alt = "CSS Logo"         style = "Filter: Chroma(Color = #000000)         DropShadow(Color = #FF0000,         OffX = 2,         OffY = 2, Positive = 1)">      <p>Text Example:</p>      <div style = "width: 357;         height: 50;         font-size: 30pt;         font-family: Arial Black;         color: red;         Filter: DropShadow(Color = #000000, OffX = 2, OffY = 2, Positive = 1)">CSS Tutorials</div>   </body></html>

文章推荐

使用 CSS 设置阴影效果

示例

css如何让导航栏变透明

css 怎么去除a标签的手形

css里怎样设置字体大小和字体颜色

css如何固定导航栏

css边框变圆角边框怎么写