在 HTML 中使用 CSS3 实现阴影效果,可以通过 box-shadow 属性来完成。box-shadow 属性可以设置元素的阴影样式,包括阴影的位置、大小、颜色等。
语法如下:
box-shadow: h-shadow v-shadow blur spread color inset;
其中,各参数的含义如下:
示例代码如下:
.shadow {
box-shadow: 2px 2px 5px #888888;
}
上述代码表示为元素添加一个阴影,阴影的水平位置为2px,垂直位置为2px,模糊距离为5px,颜色为#888888。
此外,还可以使用 text-shadow 属性为文字添加阴影效果,用法与 box-shadow 类似,语法如下:
text-shadow: h-shadow v-shadow blur color;
其中,各参数的含义与 box-shadow 相同,只不过作用对象是文字。
总之,box-shadow 和 text-shadow 属性是实现阴影效果的重要关键词。