css单边投影与双侧投影
来源:互联网 发布:python 数据挖掘 项目 编辑:程序博客网 时间:2024/05/02 20:50
box-shadow做单边投影的核心是第四个参数 扩张半径,这个参数会根据你指定的值去扩大或缩小投影尺寸,如果我们用一个负的扩张半径,而他的值刚好等于模糊半径,那么投影的尺寸就会与投影所属的元素尺寸完全一致,除非使用偏移量来移动他,否则我们将看不到任何投影。
因此,如果此时给予一边一个正的偏移,你就会在该侧看到单边投影的效果。
顶部单边投影:
box-shadow: #000 0 -5px 5px -5px;
底部单边投影:
box-shadow: #000 0 5px 5px -5px;
左侧单边投影:
box-shadow: #000 -5px 0 5px -5px;
右侧单边投影:
box-shadow: #000 5px 0 5px -5px;
如果我们想在两侧投影:
box-shadow: 5px 0 5px -5px #000,-5px 0 5px -5px #000
查看原文链接: https://www.chengrang.com/box-shadow-one-side.html
1 0
- css单边投影与双侧投影
- 投影
- 投影
- 投影
- 投影
- 投影
- 投影
- 透视投影与正交投影
- css 背景渐变,投影
- DIV+CSS投影效果
- css投影效果
- CSS样式投影效果
- 高斯-克吕格投影与UTM投影
- 地理坐标与投影
- 高斯克吕格与UTM投影
- 遮盖与投影
- Unity与全息投影
- 投影与三维视觉
- 网络利器NMAP系列(一)| 网络扫描介绍
- 32位程序注入64位dll到64位进程中失败
- 前两天终于收到IT生涯的第一份offer了
- 设计模式——代理模式(理解静态代理和动态代理+代码)
- Github上10个最流行的数据可视化项目
- css单边投影与双侧投影
- SSH框架---核心原理(二)
- 闲谈--心态
- 安装apk时出现错误Failure [INSTALL_FAILED_DEXOPT]问题解决的方法
- servlet 验证码
- 微软开源认知服务CNTK的测试(语音训练)
- List集合转化为自定义规则的字符串,List集合序列化为一个String 字符串(规则自己定)
- SpannableString的使用
- C#和C++混合编程