css实现单侧阴影

初心w50t2

已于 2024-04-08 17:57:18 修改

阅读量1.8k

点赞数

分类专栏： CSS3与HTML5 文章标签： css css3 html

于 2022-05-07 16:29:32 首次发布

本文链接：https://blog.youkuaiyun.com/qq_41910413/article/details/124633707

版权

CSS3与HTML5 专栏收录该内容

13 篇文章

订阅专栏

box-shadow实现单侧阴影效果：

.top { box-shadow: 0px -10px 10px -10px rgba(18, 21, 38, 0.3); }    

.right { box-shadow: 10px 0 10px -10px rgba(18, 21, 38, 0.3); }    

.bottom { box-shadow: 0 10px 10px -10px rgba(18, 21, 38, 0.3); }  

.left { box-shadow: -10px 0 10px -10px rgba(18, 21, 38, 0.3); }

.right-bottom { box-shadow: 5rpx 5rpx 10rpx rgba(18, 21, 38, 0.3); }