css 实现呼吸灯效果

news/2024/12/18 12:57:32/

先看效果:

在这里插入图片描述
在这里插入图片描述

动画的结果就想实在呼吸,完整的代码如下:

<template><div class="container"><div class="long-breath"></div></div>
</template><style  lang="less">css">
html, body{height: 100%;background-color: white;
}
.container{position: relative;width: 100%;height: 80px;.long-breath {position: absolute;width: 100px;left: 0;bottom: 0;animation: 2s shadowBreath ease-out infinite normal;background: #ffffff;}
}
@keyframes shadowBreath {0%,100% {box-shadow: 0 0 4px 1px rgba(42, 170, 255, 0.7);}50% {box-shadow: 0 0 20px 5px rgb(42, 170, 255);}
}
</style>

http://www.ppmy.cn/news/1556121.html

相关文章

什么是评价搭配

一、评价搭配的概念 评价搭配是指在文本中&#xff0c;由评价词&#xff08;如 “好”“坏”“优秀”“糟糕” 等表达主观意见的词&#xff09;和被评价对象&#xff08;如产品名称、服务类型、人物等&#xff09;组成的语义单元。例如&#xff0c;在 “这部手机的拍照效果很好…

element左侧导航栏

由element组件搭建的左侧导航栏 预览: html代码: <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>首页</title><style> /*<!-- 调整页面背景颜色-->*/body{background-colo…

[SZ901] JTAG合并功能(类似FPGA菊花链)

SZ901 JTAG支持将JTAG端口组合&#xff0c;最多将四个JTAG变成一个 设置如下 Vivado 识别结果如下 两块板子&#xff0c;变成一组&#xff0c;&#xff0c;可以同时抓取信号&#xff0c;调试&#xff01; SZ901 已上架淘宝&#xff0c;搜素“SZ901”哦

贪心算法(二)

目录 一、最长递增子序列 二、递增的三元子序列 三、最长连续递增序列 四、买卖股票的最佳时机 五、买卖股票的最佳时机II 一、最长递增子序列 最长递增子序列 拿到这道题&#xff0c;我们最先想到的就是用动态规划的方法去解决它。使用动态规划的方法&#xff0c;我们只…

【时间序列分析】距离相关系数(Distance Correction)理论及Python代码实现

文章目录 1. 距离相关系数算法介绍2. Python代码实现3. 优缺点及作用4.总结4.1 线性依赖关系4.2 非线性依赖关系4.3 单调依赖关系4.4 复杂依赖关系 1. 距离相关系数算法介绍 距离相关系数&#xff1a;研究两个变量之间的独立性&#xff0c;距离相关系数为0表示两个变量是独立的…

【Linux】基础IO(内存文件)

目录 一、预备知识二、复习常见C语言的文件接口2.1 文件接口的说明2.1.1 fopen函数2.1.2 fputs函数2.1.3 fclose函数 2.2 文件接口的使用 三、认识操作文件的系统调用3.1 系统调用的说明3.1.1 open函数3.1.1.1 Linux中常用的传参方法 3.1.2 write函数3.1.3 close函数 3.2 系统调…

设计模式2

23中设计模式分类 创建型模式&#xff1a;对象实例化的模式&#xff0c;创建型模式用于解耦对象的实例化过程。&#xff08;对象的创建和对象的使用分离&#xff09; 5种&#xff1a;单例模式、工厂模式、抽象工厂模式、原型模式、建造者模式 结构型模式&#xff1a;把类或对…

解决Linux 虚拟机网段与虚拟机配置网段不一致

1.修改静态网络配置 cd /etc/sysconfig/network-scripts/ vim ifcfg-ens33 TYPEEthernet BOOTPROTOstatic NAMEens33 DEVICEens33 ONBOOTyes IPADDR192.168.232.209 NETMASK255.255.255.0 GATEWAY192.168.232.2 DNS18.8.8.8 2.重启网络 systemctl restart network