微信小程序css盒子阴影
时间: 2024-05-29 12:06:39 浏览: 88
微信小程序商城系统源码
微信小程序中可以使用 `box-shadow` 属性来给元素添加阴影。该属性可以接受多个值,分别表示阴影的颜色、水平偏移量、垂直偏移量、模糊半径和扩展半径。例如:
```
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
```
该属性表示添加一个黑色、不透明度为 0.2 的阴影,水平和垂直偏移量都为 0,模糊半径为 10px,扩展半径为 0。
还可以使用 `inset` 关键字来表示内阴影。例如:
```
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.2);
```
该属性表示添加一个黑色、不透明度为 0.2 的内阴影,水平和垂直偏移量都为 0,模糊半径为 10px,扩展半径为 0。
如果需要添加多个阴影,可以使用逗号分隔它们。例如:
```
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2), inset 0 0 10px rgba(255, 255, 255, 0.5);
```
该属性表示添加两个阴影,一个是黑色、不透明度为 0.2 的外阴影,另一个是白色、不透明度为 0.5 的内阴影。
阅读全文