0% {
opacity: 0
}
100% {
opacity: 1
}
}
#110 {
-webkit-animation: twinkling 1s infinite ease-in-out
}
参考如上。
稍微解释一下，定义两个状态，一种状态下透明度为 0%，另一种状态下透明度为 100%，无限次地在 1 秒内切换这两种状态，看起来就是闪烁了。
需要准备的材料分别有：电脑、chrome浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<style>标签中，输入css代码：
@keyframes blink{
0%{opacity: 1}
100%{opacity: 0}
}
@-webkit-keyframes blink {
0% { opacity: 1}
100% { opacity: 0}
}
.blink{
color: #dd4814
animation: blink 1s linear infinite
-webkit-animation: blink 1s linear infinite
}
3、浏览器运行index.html页面，此时文字实现了闪烁的效果。
#header-login{ /*顶部登陆条*/width:1000px
height:18px
background:url(image/header-login-bg.gif) repeat-x top left｝
看上边的代码，主要有两点，1.最好把那张背景图直接放在同一目录的images下，这样子必免浏览器走弯路找你的图片路径，2.top和left.在写的时候最好还是加上。最后你有一句是重复删掉
忘了说一句不知道你的背景图片多大，越小越好！
这个问题就不是CSS的问题了，我觉的是你的页面加载的东西太多了，而且肯定有由先择行的，导致页面，先执行了由先执行的。这种问题只能用排除，从最有可能的地方一点点的试。不过你可以，先把所有的东西移除，只保留你想要的，看看什么结果
