css3之animation制作闪烁文字效果

最新推荐文章于 2025-10-18 17:01:29 发布

转载最新推荐文章于 2025-10-18 17:01:29 发布 · 1.1w 阅读

文章标签：

#css3 #特效

css/css3 专栏收录该内容

79 篇文章

订阅专栏

本文介绍了一个简单的CSS动画案例——实现文字阴影的周期性变化效果。通过使用@keyframes定义动画，使文本在页面上产生浮动感，同时设置动画无限循环播放。此案例适用于初学者了解CSS动画的基本用法。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        .box{ animation: change 1s  ease-in  infinite ; font-size: 36px; color:#f00; font-weight: bold}
        @keyframes change {
            0%{ text-shadow: 0 0 4px #f00}
            50%{ text-shadow: 0 0 40px #f00}
            100%{ text-shadow: 0 0 4px #f00}
        }
    </style>
</head>
<body>
<a class="box">太阳的后裔</a>
</body>
</html>

源引：http://www.w3cfuns.com/notes/13835/596cd96f59a09431a2343a9726c295d5.html