css3 红色阴影边框紧急提醒呼吸灯特效

appcanLiYunLong

于 2024-07-30 08:09:49 发布

阅读量225

点赞数 2

分类专栏： css 文章标签： css3 javascript 前端

本文链接：https://blog.csdn.net/appcanLiYunLong/article/details/140786556

版权

css 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

效果截图

在这里插入图片描述

代码

<!DOCTYPE html>
<html>
  <head>
    <title>红色呼吸灯紧急特效</title>
    <style>
    @keyframes alarm {
        0% {box-shadow: 0 0 30px #ff0000;}
        50% {box-shadow: 0 0 60px #ff0000, inset 0 0 60px #ff0000;}
        100% {box-shadow: 0 0 30px #ff0000;}
    }

    body {
    height: 100vh;
    margin: 0;
    animation: alarm 1s linear infinite;
    }

    </style>
  </head>
  <body></body>
</html>