box-shadow制作边框模糊
来源:互联网 发布:数据挖掘建模 编辑:程序博客网 时间:2024/06/07 16:11
不用border,直接用box-shadow的阴影效果来做边框,然后再用模糊做泛出,
.iconb{
width: 18px;
height: 18px;
background-color: #188eee;
box-shadow: 0px 0px 0px 5px #c9e0f4;
border-radius: 50%;
position: absolute;
z-index: 1;
left: 20px;
}
.icon1{
top: 30px;
}
.icon2{
top: 310px;
}
.icon1:hover,.icon2:hover{
animation: icon 0.5s infinite ease-in-out;
animation-fill-mode:both;
animation-direction:alternate;
}
@keyframes icon{
from{
box-shadow: 0px 0px 1px 1px #c9e0f4;
}
to{
box-shadow: 0px 0px 0px 5px #c9e0f4;
}
}
阅读全文
0 0
- box-shadow制作边框模糊
- 边框阴影box-shadow
- box-shadow多重边框
- css3 边框阴影 box-shadow
- CSS3 边框 border-radius box-shadow
- box-shadow border透明边框 按钮
- css元素边框发光效果——box-shadow
- CSS3新特性box-shadow实现多重边框
- 如何给边框添加阴影效果:box-shadow
- box-shadow
- box-shadow
- box-shadow
- box-shadow
- box-shadow
- box-shadow
- box-shadow
- box-shadow
- box-shadow:
- 自动获取行高
- CListCtrl控件使用方法总结
- ipcs、ipcrm、sysresv、kernel.shmmax
- 解决中文乱码问题
- Python笔记9:Python中的json
- box-shadow制作边框模糊
- 去除WinRAR弹窗广告
- 【两项业界最佳】普林斯顿新算法自动生成高性能神经网络,同时超高效压缩
- 欢迎使用CSDN-markdown编辑器
- java题目:有n个整数,使其前面各数顺序向后移m个位置,最后m个数变成最前面的m个数
- bzoj 3329: Xorequ(DP+矩阵快速幂)
- Spring Data Jpa 关于fetch join 的错误
- RabbitMQ(二)——Work Queues
- Java基础与数据库对应数据--Java基础2阶段