css3怎么构建阴影

CSS3可通过Box-shadow属性来构建元素的阴影效果。

    Box-shadow: 水平偏移量 垂直偏移量 阴影模糊半径 阴影扩散半径 阴影颜色 inset;

参数说明：

• 水平偏移量：阴影在水平方向上的偏移量，可以为正数或负数，正数表示阴影在目标元素右侧，负数则表示在左侧。
• 垂直偏移量：阴影在垂直方向上的偏移量，可以为正数或负数，正数表示阴影在目标元素下方，负数则表示在上方。
• 阴影模糊半径：阴影的模糊程度，值越大阴影越模糊，可以为0。
• 阴影扩散半径：阴影的扩散程度，值越大阴影越大，可以为0。
• 阴影颜色：阴影的颜色值，可以为RGB、HEX、HSL或者颜色名称。
• inset：可选值，表示阴影内部或者外部，默认为外部，不加inset则为外部阴影。

示例代码:

    .Box {
        Box-shadow: 5px 5px 5px #000;
    }

上述代码表示给class为Box的元素添加一个水平偏移量为5px，垂直偏移量为5px，阴影模糊半径为5px，阴影颜色为黑色的外部阴影效果。

CSS3中的阴影效果可实现多种视觉效果，如卡片浮起效果、深度效果等，通过合理的组合设置参数，可以创建出多种不同的阴影效果。