css,给边框加上阴影
在CSS中,你可以使用 box-shadow
属性来给元素的边框添加阴影。box-shadow
属性需要至少两个值(水平偏移和垂直偏移),并且可以接受最多五个值(包括模糊距离、扩大距离和颜色)。
以下是一个例子:
div {
border: 1px solid #333;
box-shadow: 3px 3px 5px 6px #ccc;
}
在这个例子中:
3px
是阴影的水平偏移量。- 第二个
3px
是阴影的垂直偏移量。 5px
是阴影的模糊距离,这会使阴影看起来更软或更硬。6px
是阴影的扩大距离,这会使阴影变得更大或更小。#ccc
是阴影的颜色。
要注意的是,这些值可以是正数或负数,而且你可以添加多个阴影,只需用逗号分隔即可。例如:
div {
border: 1px solid #333;
box-shadow: 3px 3px 5px 6px #ccc, -2px -2px 5px 6px #999;
}
这将为元素添加两个阴影,第一个向右下方偏移,第二个向左上方偏移。