文章/答案/技术大牛

发布

社区首页 >问答首页 >CSS3/HTML5中的辉光动画效果

问CSS3/HTML5中的辉光动画效果
EN

Stack Overflow用户

提问于 2014-01-21 01:58:52

回答 2查看 14.6K关注 0票数 2

有没有可能在不使用Flash或GIF的情况下，在网页上的按钮和其他对象上创建类似的动画光晕效果？

animation

glow

html

css

回答 2

Stack Overflow用户

回答已采纳

发布于 2014-07-15 06:45:35

使用@keyframes。

你可以像这样制作一个脉动动画。

#box {
  width:80px;
  height:80px;
  background:gray;
  animation:pulse 0.5s infinite alternate;
}

@keyframes pulse {
  from { box-shadow:0px 0px 10px 3px #0066cc; }
  to { box-shadow:0px 0px 20px 5px #0066cc; }
}

注意@keyframes应该像这样加前缀：@-webkit-keyframes。此外，animation属性还应作为前缀

票数 13

Stack Overflow用户

发布于 2014-01-21 02:10:47

添加一个box-shadow到你的CSS并使它成为鲜艳的颜色。它不会有动画，但它会有一种发光的效果。小提琴：http://jsfiddle.net/5N2ra/

另请参阅http://css-tricks.com/snippets/css/css-box-shadow/

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/21240973

复制

相似问题

问CSS3/HTML5中的辉光动画效果
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问CSS3/HTML5中的辉光动画效果EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问CSS3/HTML5中的辉光动画效果
EN