发布于 2023-09-25 02:33:32 浏览 226
<style>
div {
width: 200px;
height: 200px;
background-color: #f1f1f1;
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}
</style>
下面是一个示例,将一个 <div> 元素设置为带有阴影效果:
11、
在上述示例中,<div> 元素的宽度和高度分别为 200 像素,并设置了背景颜色为 #f1f1f1。box-shadow 属性的值为 2px 2px 4px rgba(0, 0, 0, 0.3),表示在水平方向上的偏移量为 2px,在垂直方向上的偏移量也为 2px,模糊程度为 4px,阴影颜色为深灰色,透明度为 0.3。
12、
可以根据需要调整 box-shadow 属性的不同参数来实现不同的阴影效果。同时,还可以通过使用多个 box-shadow 属性值组合来创建更复杂的阴影效果。
上一篇:css的transition用法
下一篇:返回列表
WORD基础 发布于 2024-02-03 23:01:31 浏览 164
JS基础 发布于 2023-09-24 21:58:00 浏览 181
JS基础 发布于 2023-09-24 21:48:42 浏览 206
JS基础 发布于 2023-09-21 11:22:55 浏览 175
CSS基础 发布于 2023-09-19 22:25:58 浏览 233
PS基础 发布于 2023-08-25 19:01:20 浏览 580
JS基础 发布于 2023-06-19 15:43:22 浏览 258
EXCEL基础 发布于 2023-05-21 13:17:02 浏览 309