使用 CSS 设置阴影效果
cssweb developmentfront end technology更新于 2025/2/20 13:00:17
阴影用于在指定的 X(水平)和 Y(垂直)偏移量和颜色处创建对象的阴影。
此滤镜可使用以下参数:
| 参数 |
描述 |
|---|---|
| color |
颜色，#RRGGBB阴影的格式。
|
| offX
|
阴影沿 x 轴相对于可视对象的偏移像素数。正整数表示阴影向右移动，负整数表示阴影向左移动。 |
| offY |
阴影沿 y 轴相对于可视对象的偏移像素数。正整数表示阴影向下移动，负整数表示阴影向上移动。
|
| positive
|
如果为 true，则对象的所有不透明像素都会产生阴影。如果为 false，则所有透明像素都会产生阴影。默认值为 true。 |
示例
您可以尝试运行以下代码来设置阴影效果:
<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 的更多信息:https://www.cainiaomax.com/css/
